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Chapter I: Planning your Web site 





Welcome to the Claris Home Page application from Claris Corporation. 
Claris Home Page is a powerful Web authoring tool you can use to 
create Web pages quickly and easily. This guide explains how to use 
Claris Home Page to author your Web pages for publishing on the World 
Wide Web. 


Note You can visit the Claris Web site for the latest information on 
Claris Home Page, at http://www.claris.com/. 


Hypertext Markup Language (HTML) is a language used to display 
documents on the World Wide Web so they can be viewed from any 
platform (such as UNIX, Windows, and Macintosh). You don’t need to 
know HTML in order to author Web pages because Claris Home Page 
provides the HTML tags for you. On the other hand, Claris Home Page 
provides you a way to work directly in the HTML source and add your 
own HTML tags if you want. 


Spend some time planning your Web site so that the organization and visual 
presentation of your Web pages communicate your intent effectively. When 
you are ready to build your site, you can use the Claris Home Page Site 
Editor to view and edit your site’s organization. In the Site Editor, you can 
also perform other tasks, such as creating pages, checking the download 
time of your site, and uploading your files to the Web. 


Designing the structure of your Web site 


Designing your Web site begins with planning the purpose of the site, 
what the content will be, and how you want to structure it. A well- 
designed Web site can make it easy for your audience to navigate and get 
the information you want them to receive. It can also make it easier for you 
to manage and update later on. 
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Planning the purpose and content of the site 


Perhaps the most important consideration is figuring out how your site 
will serve your intended audience. Your site may provide entertainment, 
or a special service, such as access to reference materials, advertising, or 
sales of goods and services. Your site could include a questionnaire that 
solicits information from your viewers. Knowing what information your 
viewers want and how often you should update that information will 
help you maintain your site so that it’s fresh and useful. The more you 
know about your audience, the better you can serve them with your site. 


Outlining the structure of the site 


When you plan your site, you may want to experiment with several 
designs for organizing information, and consider multiple ways people 
can navigate to the individual pages in your site. Most people will 
experience your site one page at a time with the home page as the 
starting page. The home page will often have some sort of table of 
contents that describes what’s on the site. Sketching an outline or flow 
chart of your site can illustrate the home page and how it will link to the 
other pages in the site. You can resolve any design issues and change the 
overall structure of the site before you create the actual pages and links 
in Claris Home Page. 
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It’s always possible that someone may arrive at another page in your site 
first. For example, someone using a search engine such as Yahoo or Alta 
Vista may search for a keyword that appears somewhere within your 
site, but not on the home page. For this reason, it’s a good idea to include 
a link on all of the pages in your site that goes back to the home page. 


Deciding what to include in your Web pages 


Claris Home Page provides several ways to display information in your 
Web pages. The options you use depend on the type of information you 
want to include. 


Deciding what to include in your Web page can also depend on who 
your audience is and which browsers they’ ll be using. Older browsers 
that don’t support the current version of HTML won’t necessarily 
support all of the latest options, such as tables, frames, text fonts and 
color, or plug-ins for databases, movies, sound, and applets. 


Using common elements to create a theme 


Repeating common elements in your site can be effective for tying 
information together and communicating the main message of your site. 
Using company logos, slogans, mottos, and special graphics are good 
examples of this. You can also take this a step further and use art for the 
background of your pages, special images for buttons, and color 
schemes for text and images. More subtle effects for creating a unifying 
theme across your Web pages include naming your links consistently, 
having special placement of text and images, and using bold and italics 
in your pages. 


You can create your own Claris Home Page libraries to save these special 
design effects and common elements and then use them for each new page 
you create. In addition, you can save any page you create as an HTML 
template, and use this template to create more pages for your site. 
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Including text and images in your pages 


Text and images are the basic visual elements you see in most Web sites 
and are supported by all versions of HTML. Claris Home Page provides 
ways to use text and images to build a Web site easily. In Claris Home 
Page, you can type text as you would in a word processor, and the 
appropriate HTML is inserted for you. If you want to include some 
special characters, such as the copyright symbol, in your site, you can 
use Claris Home Page to format the symbols as HTML so that they 
appear in all browsers. You can also bring text you created in another 
application into a Web page and easily apply HTML formatting styles 
to it. 


When you use images other than JPEG or GIF, Claris Home Page 
converts them, if possible, to GIF format, one of the standard image 
formats recognized by Web browsers. Claris Home Page includes 
libraries of GIF images you can use in your pages. You may decide to 
use images instead of text for your links in a table of contents or 
navigational list, so that you associate information graphically to other 
pages in your site. When selecting images for your site, keep in mind 
that larger, complex images that incorporate many colors and textures, 
can significantly add to the download time of a page. 


You can easily get an estimate for download time of your pages using 
the Document Statistics feature. (See “Using the Statistics window” on 
page 2-14 for more information.) Word counts for your pages are also 
available through this feature. 


Tip If you use black and white or one-color images on your pages, they 
download faster. 


Using tables or frames for page layout 


In addition to using tables for organizing information into rows and 
columns, you can hide the borders and use tables to design the page 
layout. You can simulate tabs and margins in HTML by placing text and 
images in table cells that are uniformly spaced apart. You can then use 
this table for all pages in your site. (See “Saving a page as a template” 
on page 2-25.) 
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A frame page is another useful way for controlling how information is 
displayed in your site. You can use frames to display simultaneous 
views of your Web pages, so that your viewers can navigate through 
your site in the same window. The disadvantage in using frames, 
however, is that not all browsers support frames—if you decide to use 
frames, consider setting up alternate pages for those browsers that don’t 
support them. 


Horizontal rules also offer alternative ways of controlling the layout of 
your Web page. Horizontal rules are objects you can use to divide your 
pages into sections. You can align them to the right, left and center of 
the page and change their length, width, and shading. 


Including forms or a database on your site 


Claris Home Page supports making your Web site interactive through 
the use of forms in your pages. You can use forms to solicit information 
from your viewers, whether you are prompting them to sign a guest 
book, to fill out a questionnaire, or to search your database of goods so 
they can place an order. 


To use forms, you will need a Common Gateway Interface (CGD script 
to process data back and forth between your viewer’s browser and the 
Web server where your site is published. For more information, see 
chapter 9, “Adding forms to your Web page.” 


Claris Home Page also lets you link to a FileMaker Pro 4.0 database in 
your page, so that you can use the integrated Web server capabilities of 
FileMaker Pro, instead of a CGI script, to process form data. Use the 
FileMaker Connection Assistant and FileMaker form libraries to create 
form pages that readily connect to the database. 


Including movies, sound, or animation 


You can use Claris Home Page to set up pages that feature movies, 
sound, and animation for your Web audience. A browser plug-in 
application is required for these files to display on your Web pages. 
Plug-ins are small add-on applications for viewing various types of 
information like multimedia and data processing. If you decide to 
include any elements that require a plug-in to work, your site should 
provide a link to the plug-in itself, so your viewers can download it. As 
a courtesy to your viewers, it’s also a good idea to provide brief 
instructions for putting the plug-in in their browser’s preferences folder. 
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Including applets (small applications) 


Applets, such as those written in the Java programming language, 
provide added functionality and multimedia effects to your Web pages. 
Java applets can be used to create special effects, such as clocks, 
calculators, and other interactive elements. Other types of applets are in 
the process of being developed in other programming languages (such 
as ActiveX). You can use Claris Home Page to add a Java applet to your 
Web page and to customize its parameters. 


Including your own additional HTML 


If you’re knowledgeable about HTML, you can modify the source of your 
Web page using Edit HTML Source mode. This mode shows you the 
underlying HTML enable/disable tags that describe the structure and 
function of the page contents. You can also use the object editors to add your 
own HTML code to each page element as you work in Edit Page mode. 


Me uric) 


<P><IMG SRC="IMAGES/IRSHCREM. GIF" WIDTH=245 HEIGHT=59 
X-CLARIS-USEIMAGEWIDTH X-CLARIS-USEIMAGEHEIGHT ALIGN=bottom> 
</TD> 
<TD> 


<P><IMG SRC="IMAGES/VANILLA. GIF" WIDTH=246 HEIGHT=59 
X-CLARIS-USEIMAGEWIDTH X-CLARIS-USEIMAGEHEIGHT ALIGN=bottom> 
</TD> 
</TR> 
</TABLE> 
</H4> 


<H4>Questions? We would love to hear from you.</H4> 


<P>Click here ta send us emaill</P> 


<ADDRESS><A HREF="mailto:ecc@company.com">ecc@company.com</A></ADDRE 


<P>Or click here to fill out our <A HREF="QUESTION. HTM">custamer 
satisfaction questionnaire</A> .</P> 


<CENTER>Back to <A HREF="CAFEHOME.HTM">top of page</A> .</CENTER> 
</BODY> 
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gia (el = 
SIGHEIES 
<HTHL> 


<!--This file created 10/1/97 5:55 PM by Claris Home Page version 3.0d33 
<HEAD> 
<TITLE>Espresso Cafe Company</TITLE> 
<HETA NANE=GENERATOR CONTENT="Claris Home Page 3.0d332"> 
<X-CLARIS-¥VINDO¥ TOP=42 BOTTON=477 LEFT=4 RIGHT=534> 
<X-CLARIS-TAGYIE¥V HNODE=ninimal> 
</HEAD> 
<BODY BGCOLOR="#FFFFFF"> 














<Hi><FONT SIZE="+4">{<ING SRC="images/logo.gif" WIDTH=70 HEIGHT=64 
X-CLARIS-USEINAGEVWIDTH X-CLARIS-USEINAGEHEIGHT ALIGN=middle> Espr 
Cafe</FONT><TABLE BORDER=0 WIDTH="100%"> 
<TR> 
<TD> 


<P>Welcome to the Espresso Cafe Home page. We are a small 
roasting company that supplies coffee from the world to the 
world. We have a wide selection to choose from and we 
guarantee all our products. For specific information about 
our coffees, select an item from the list below. 

</TD> 

<TD ROWSPAN=2> 


<P><ING SRC="images/coffeei.gif" WIDTH=219 HEIGHT=377 
X-CLARIS-USEINAGE¥VIDTH X-CLARIS-USEINAGEHEIGHT ALIGH=bo 





Tip Because you can view the HTML source for any page on the World 
Wide Web, looking at the source of pages you like is a great way to get 
design ideas and learn more about HTML. 


Setting up the site 


Before you begin creating the Web pages for your site, use Claris Home 
Page to set up a folder for storing the files in a single location. Defining 
the site in Claris Home Page allows you to view all the site files you 
create in the Site Editor. You can use the Site Editor to open the files, 
add new Web pages to the site, and apply document options to one or 
more pages in the site. Use the Site Editor to create a mirror of your site 
as it will be published on the Web and then use it to verify the links and 
upload the files to the server when you're ready. 


Your Internet service provider or Web server administrator may require 
that your site have a home page. The home page, usually named 
“index.htm,” is the point of entry for your site and is the first page linked 
to the domain name in the URL for your site. 


Tip You can create multiple sites within one main site folder by naming 
all the home pages in their respective site folders the same file name 
(such as index.htm). 
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It’s also a good idea to set up an images folder when you set up your site 
to contain all of the images that you insert into your Web pages. You can 
set this folder to be the default folder for storing images Claris Home 
Page automatically converts to GIF format. 


To set up a site: 
= Create a site folder to contain your pages and associated site files 
= Define the site in Claris Home Page to use the Site Editor as you work 


= Create a media or images folder within the site folder to store all the 
JPEG, GIF , and media files referenced by your Web pages 


= Set the default media folder so Claris Home Page will automatically 
store all files it converts to GIF in the specified folder 


= Use the Site Editor to keep track of the site contents 


Defining a new site 


Defining a site in Claris Home Page allows you to view the organization 
of all the site’s files in the Site Editor. You can define your site in Claris 
Home Page based on the contents of a folder. When you define a site, 
Claris Home Page creates a site definition file that stores the site 
information in the site folder and opens the Site Editor. 


To define a site using a new empty folder: 
1. Start Claris Home Page. 

For more information, see “Starting Claris Home Page” on page 2-1. 
2. Choose New from the File menu. 


3. In the New dialog box, click Create New, select Empty Site from the 
scrolling list, and click OK. 


4. In the Save As dialog box, navigate to the location where you want to 
store the site. 


5. Type the name for the site folder in the File Name text box (Windows) 
or the Save Site Folder As text box (Macintosh). 


6. Click Save. 


The Site Editor opens and displays the new site folder and its 
contents. 
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To define a site using an existing folder: 
1. Start Claris Home Page. 
2. Choose Open Folder as Site from the File menu. 


The Browse for Folder dialog box (Windows) or the Select a Folder 
dialog box (Macintosh) appears. 


3. In the dialog box, navigate to the folder you want to define as the site 
folder and click OK (Windows) or Select Folder Name (Macintosh). 


The Site Editor opens and displays the contents of the site folder you 
specified. 


Note Claris Home Page creates a site definition file, which defines the 
site based on the contents of the site folder and stores FTP login settings 
that you need to upload your site. The site definition file has the 
extension .wst and resides in the site folder. For more information see 
“Specifying the Web server account” on page 12-8. 


As you develop your Web site, you can use the Site Editor to view the 
contents, open files, or create new pages in the site. You can also make 
document changes to any of the pages, such as changing the background 
color. When your Web site is complete and ready for publishing, you 
can use the Site Editor to upload all your files to the Web in one step. 
See “Using the Site Editor” on page 2-27 for more information. 


Setting up the media folder 


A media folder is useful to have inside your site folder for containing all 
the images, movies, and other media files for your site. You can create 
this media folder on your computer, or have Claris Home Page create 
one for you and then use it for consolidating media into one location. 


To create a media folder using Claris Home Page: 


1. Open the Site Editor by choosing Open Folder As Site from the File menu 
and selecting the site folder where you want to store the images folder. 


2. In the Site Editor, click the Consolidate button [3] on the toolbar. 


If you have open or unsaved files, a message appears prompting you 
to save the unsaved files. Click OK to continue. 


The Consolidate dialog box appears. 


3. In the Consolidation dialog box, type the name of the media folder in 
the Media folder name text box. 


Claris Home Page creates a folder and places it inside the site folder. 
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4. Click Consolidate. 


For more information about consolidating images, see “Consolidating 
media files” on page 12-4. 


To set the media folder to store all images that Claris Home Page 
converts to GIF format: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Images tab in the dialog box. 
3. Click Convert and save automatically to directory. 
4. Click Browse to choose your media folder. 


For more information, see “Specifying the default converted images 
folder” on page 4-3. 


Previewing and testing your site 


There are many factors that affect the final presentation of your site on 
the Web, many of which are beyond the Web designer’s control. For 
example, your audience might be using all kinds of different computer 
systems with or without a capacity for displaying graphics. Your 
audience may also have different types of connections to the Web, 
different modem speeds, and different preferences settings in their Web 
browsers. While you may not be able to control these factors, you can 
preview the design of your pages in different Web browsers and provide 
alternative ways for viewing your site. 


Claris Home Page provides two ways to preview a page as you’ re 
designing it. You can use Preview Page mode to display your page in 
Claris Home Page as it might appear in a browser. And you can use 
Preview in Browser mode to display your page in one or two browsers 
you have set up on your computer. To use this mode, you don’t need to 
be connected to the Web. However, there are some things, such as 
external links, CGI scripts, certain applets, and form interaction, etc. that 
you must test on the Web server in order to know that they work and 
appear the way you planned them. 


Note You must have a browser installed on your computer to be able to 
use the Preview in Browser feature. 
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Testing at different resolutions 


You can test your pages for how they may appear to people using 
monitors set to lower resolutions by using the Size Window feature in 
Claris Home Page. 


To use the Size Window feature in Claris Home Page: 


= Choose Size Window from the View menu (Windows), or the Window 
menu (Macintosh), and then choose the resolution (lower than your 
current resolution), to which you would like to resize the window, 
from the submenu. 


Testing with different Web browsers 


Each browser interprets the HTML of your Web pages slightly different 
from other browsers. It’s a good idea to test your pages in as many Web 
browsers as possible. As you create your Web pages in Claris Home 
Page, you can see how they’ lI look in a browser using the Preview in 
Browser mode. When you choose this option, Claris Home Page starts 
the browser application that is set in the system registry (Windows) or 
whichever is installed—Microsoft Internet Explorer or Netscape 
Navigator—(Macintosh) and displays the page in the browser window. 
Claris Home Page uses this browser as the default until you change the 
setting. See “Previewing your work” on page 2-12 for more information 
on changing the default browser or adding a second default browser. 


There are a number of Web browsers available that work on the 
Windows, Mac OS, and UNIX platforms, including Microsoft Internet 
Explorer, Netscape Navigator, NetCruiser, Mosaic, and the America 
Online (AOL) browser. Some Web browsers are commercial programs 
and others are available free of charge. 


The same page viewed with different browsers will have different 
results in terms of what features they support. For example, not all 
browsers will support tables, and things like color, fonts, formatting 
styles and sizing may differ from browser to browser (especially across 
platforms). As a general rule, older browsers do not support newer 
HTML elements, such as frames or client-side image maps, and 
multimedia effects, such as animated GIFs or right-aligned images. If 
you suspect that some of your intended audience will have older 
browsers, you might consider having alternative text-only pages of your 
site they can view. 
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Note Claris Home Page uses the Rainbow or Safety Palette, which is 
supported by all browsers, by default. Claris Home Page also supports 
several color palettes that you can use to build your Web pages. 
However, not all palettes are supported uniformly by all Web browsers. 
For example, Microsoft Internet Explorer supports fewer colors than 
Netscape Navigator. If you use an unsupported color for your text, the 
browser will not display the color of the text. Make sure to test your 
pages on many browsers. 


Testing on the Web server 


Web servers are computers that store Web sites and respond to requests 
from different browsers over the Internet. The server is always turned on 
and running 24 hours a day. Your entire Web site will reside on a Web 
server when it’s published. 


There are some things in your Web site that you can’t test until you 
actually upload the site to the Web server. For example, if your site 
includes elements that require a CGI script to work (such as a form, a 
searchable database, or a server-side image map), you’ II need to test how 
it works with the CGI script on the Web server. 


Web page elements you will want to test once your files are on a server 
include: 


= Server-side image maps 
= Forms connected to a CGI script 
= Forms connected to a FileMaker Pro database 


= Movies, sound, and animations that require plug-ins and helper 
applications 


= Applets that extend the functionality of the site 

= Links to external Web sites or Internet-accessible resources 

= External links to helper applications that go with your multimedia 
= Mailto links for sending messages to your email address 

You can view an estimated download time of these elements in Claris 


Home Page. For more information, see “Using the Statistics window” on 
page 2-14. 


Chapter 2: Claris Home Page basics 





Claris Home Page provides you with the tools you need to create Web 
pages. You can use these tools to insert text, images, tables and other 
Web page elements into a page, create links to other pages, and edit your 
work. 


Two edit modes let you edit the content of your Web page and the actual 
HTML source for the page. Object and link editors let you change the 
attributes of an element, such as the size of an image, the alignment of 
text in a table cell, or the URL of a linked page. Toolbars and special tool 
palettes make it easy to switch modes, insert elements, and apply 
formatting styles in your page. 

Other options help you preview your work in Claris Home Page or a 
browser of your choice, view time estimates of how long it might take 
to download a page or an element on the page, and make changes to 
several pages at one time using the Site Editor. 


Claris Home Page also provides a variety of templates and assistants to 
help you get started. 


Starting Claris Home Page 


To start Claris Home Page, double-click the Claris Home Page 3.0 folder 
on your system to display its contents, and double-click the Claris Home 
Page 3.0 application icon. 


Windows: You can also click the Start button, point to the Claris Home 
PR Page 3.0 folder, and then click the Claris Home Page icon. Or you can 
HomePage.e... right-click an HTML file and choose Claris Home Page from the context 
Windows menu. 
Sp Macintosh: You can also double-click a file that was created in Claris 
a 


Home Page to open the application. 


Macintosh 
When you start Claris Home Page, a new untitled Web page appears on 


the screen. 
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If you don’t want Claris Home Page to create an untitled document each 
time you start it, you can change the default setting to display nothing or 
to display an Open dialog box at startup. Choose Application Options from 
the Tools menu (Windows) or Preferences from the Edit menu 
(Macintosh), click the General tab, and then choose the appropriate 
setting from the At Startup pop-up menu. 


Creating a Web page 


There are several ways you can create a Web page in Claris Home Page. 
You can start from scratch, adding text and other elements to a blank 
page, or you can use Claris Home Page templates that already contain 
information. Templates are sample Web pages that contain predefined 
formats for you to use as a starting point when you create a Web page. 


To create a blank, untitled Web page do one of the following: 
= Choose New Page from the File menu. 


Windows: You can also click the New Page button [1] on the Basic 
toolbar. 


= Choose New from the File menu, select Create New, select Blank Page, 
and then click OK. 


= Open the Site Editor and click the New Page button ["}] on the toolbar. 


See “Using the Site Editor” on page 2-27 for more information. 


To create a page using a template: 
1. Choose New from the File menu. 
The New dialog appears. 
2. Click Use Template and then choose a template from the scrolling list. 
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3. Click OK. 


Note You can make your own HTML templates from pages you create 
and use them repeatedly as often as you wish. Templates that you create 
appear in the scrolling list in the New dialog box. See “Saving a page as 
a template” on page 2-25. 


Using site assistants 


Included with Claris Home Page are special assistants to help you create 
a specific kind of site, such as one that uses frames, or one that contains 
forms connected to a FileMaker Pro database. Assistants are step-by- 
step panels that guide you through the process of creating these special 
types of Web sites. You specify the information for the site and Claris 
Home Page creates the pages and links them together. 


To use a Site assistant: 
1. Choose New from the File menu. 


A New dialog box opens. 
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2. Click Use Assistant and then select an assistant in the list. 


Select this assistant To do this 


FileMaker Connection Assistant Create a Web site that lets your Web audience access 
a FileMaker database from the Web. 





Frame Assistant Create frame documents—a special kind of Web 
page that is divided into sections called frames. 





Newsletter Assistant Create a Web site for a newsletter. This assistant 
creates a home page with links to other pages or 
links to anchors in the home page. 





Personal Site Assistant Create a personal Web site to display photos, 
favorite links, addresses, and more. 





Presentation Assistant Create a presentation. This assistant creates a series 
of sequential Web pages that you can use to inform 
clients of new products or services. 





Report Assistant Creates a Web site for a report. This assistant creates 
a home page with links to other pages or links to 
anchors in the home page. 





School Site Assistant Create a Web site for your school. Each classroom 
or department can have their own Web page. 





Standard Site Assistant Create a Web site with links to multiple pages. 





3. Click OK. 
4. Follow the instructions on each panel of the assistant. 


A progress chart indicates your progress as you complete the steps. 


Note You can create an empty site folder and add your own pages to it. 
Select Create New in the New dialog box and select Empty Site in the 
scrolling list. See “Defining a new site” on page 1-8 for more 
information. 


Working in a Claris Home Page document 


When you create a Web page in Claris Home Page, it is displayed in Edit 
Page mode by default. Working in Edit Page mode is similar to working 
in word processing documents. For example, you can type text, insert 
images, or copy and paste elements in much the same way. However, 
because of HTML limitations, there are some things you can’t do, such 
as set tabs or page margins. Claris Home Page provides toolbars, 
palettes, and object and link editors that let you apply HTML attributes 
to your Web page elements. 
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Keyboard shortcuts are listed next to options in the menus and a context 
menu is also available for some elements like text and images while 
you’re working on a page. To display the context menu, right-click 
(Windows) or Control-click (Macintosh) the element in the page. For a 
listing of keyboard, mouse, and context menu shortcuts, see appendix B 
“Shortcuts for using Claris Home Page.” 


Opening HTML files 


You can open and edit any HTML file in Claris Home Page. 


To open an HTML file: 

1. Choose Open from the File menu. 
2. Select the file you want to open. 
3. Click Open. 


Changing the size of the document window 


You can change the size of your document window to view it using your 
monitor’s specific size. 


To change the size of your document window: 


1. Choose Size Window from the View menu (Windows) or Window 
menu (Macintosh). 


2. Select the monitor size you want to view your document window in. 


Select Default to return the document window to the size that Claris 
Home Page first opened your document as. 


Using Edit Page mode 


Edit Page mode displays the contents of your Web page in a format that 
allows you to perform all of the editing tasks involved in creating your 
Web page, such as typing and formatting text, inserting images, creating 
links, and so forth. 


By default, when you first open a file or create a new document, Claris 
Home Page displays the document in Edit Page mode. 


If you want to change the default mode that Claris Home Page opens 
documents in, choose Application Options from the Tools menu 
(Windows) or Preferences from the Edit menu (Macintosh), click the 
General tab, and then choose Preview Page or Edit HTML Source from the 
Open Documents in pop-up menu. 
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To switch to Edit Page mode, choose Edit Page from the View menu 
(Windows) or from the Window menu (Macintosh) or click the Edit Page 
button on the toolbar. 


Cutting, copying, and pasting 
In Claris Home Page, you can cut, copy and paste text, tables, links, 


images, and other elements within your Web page, between other Web 
pages, or between Claris Home Page documents and other applications. 


To cut or copy and paste an element: 
1. Select the element. 
2. Choose Cut or Copy from the Edit menu. 


If you choose Cut, Claris Home Page removes the element from its 
original location, and places it on the Clipboard. If you choose Copy, 
the element stays where it is and a copy is placed on the Clipboard. 


3. Select the location in the page where you want the element to go. 


4. Choose Paste from the Edit menu. 


Tip Youcan also drag elements to cut, copy, and paste them. If you drag 
an element within the same document, it is cut and pasted. If you drag 
an element from one Claris Home Page document to another, it is copied 
and pasted. 


Undoing your work 


If you want to delete something in your document, select it and press the 
Backspace or Delete key. 


If you want to cancel the last action you performed, choose Undo from 
the Edit menu. 


Using the toolbars and palettes 


Claris Home Page includes toolbars and special tool palettes you can use 
to perform tasks quicker than selecting the corresponding option from a 
menu. Tool tips display a description of the tools when you hold the 
mouse pointer over them. 


Basic and Style toolbars: The Basic toolbar provides access to many of 
the commonly used features in Claris Home Page such as Edit Page, 
Preview Page, and Preview in Browser modes. Click a button to activate 
your choice. When you click a button to insert an element, the element 
is inserted at the insertion point in the page. 
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Tip You can also drag the Insert Anchor (], Insert Horizontal Rule EJ, or 
Insert Table [Eg] buttons onto your page to insert those elements. 
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Basic toolbar (Windows) 
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Basic toolbar (Macintosh) 


The Style toolbar has buttons you can use to format text. Select the text 
and click a button to activate your choice, or choose an option from the 
pop-up menu. 


Tip You can also drag the Make Numbered List Entry button [=], or Make 
Bullet List Entry button =| onto your page to insert those elements. 
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Style toolbar 


The Basic and Style toolbars appear by default. 


Image editor toolbars: The toolbars in the Image editors provide tools 
for you to add transparency or interlacing to images and hotspots to 
image maps. To use these toolbars, double-click the image to open the 
Image Object Editor. To open the Client-Side Image Map Editor, click 
the Behavior tab, if necessary, and then click the Edit button. To open the 
Transparency and Interlacing Image Editor, click the Appearance tab, if 
necessary, and then click the Set button. 
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Client-Side Image Map Editor toolbar 
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Transparency and Interlacing Image Editor toolbar 
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Frame page toolbar: When you create a frame page, the Edit Frames 
button [B] appears on the Basic toolbar to let you know you are working 
in Edit Frames mode. Also added to the toolbar are five frame layout 
buttons. Click on these buttons to subdivide a frame vertically, 
subdivide a frame horizontally, add a frame to your frame page, select a 
parent frameset, or select a root frameset. 
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Toolbar in Edit Frames mode 
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Library toolbar: When you open a Claris Home Page library, a library 
toolbar appears on the library window along with a Library menu option. 
This toolbar provides buttons for new entries into a library, inserting a 
specific element into a page, and using a specific element for the 
background of a page. 


Olls|e]a2 


Library toolbar 


Site Editor toolbar: Another toolbar is found in the Site Editor. This 
toolbar provides buttons for adding a new page, setting document 
options, checking site statistics, verifying links and references, 
consolidating, and uploading. 


Site Editor toolbar 





Forms tool palette: Claris Home Page has a floating Forms tool palette 
you can use to insert form elements into your documents. To display the 
Forms tool palette, choose Forms Palette from the View menu (Windows) 
or Show Forms Palette from the Window menu (Macintosh). To hide the 
Forms tool palette, click the close box or choose it again from the View 
menu (Windows) or from the Window menu (Macintosh). 
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To use the Forms tool palette, drag one of the buttons onto your Web 
page to add the corresponding element. You can also click once on a 
button in the Forms tool palette to insert an element at the insertion 
point. Move the Forms tool palette anywhere on your screen by dragging 
its title bar. 


Using the object and link editors 


When you add an element to your Web page, such as a table, an image, 
or a hypertext link, you use an object editor or the link editor to specify 
or make changes to its characteristics. 


In all of the object and link editors, you will find an additional field in 
which you can add extra HTML. You can add the HTML directly to the 
object or hypertext link in Edit Page mode without having to go to Edit 
HTML Source mode. For more information, see “Adding extra HTML 
to your page” on page 2-16. 


Most object editors open for you when you insert an element into the 
page. You can use different methods to open the object editor for an 
element: 


= Double-click the element 


= Select the element and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu (Macintosh) 


= Select the element and click the Object Editor button on the Basic 
toolbar 














Click to expand bottom —4 
section of Link editor 
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You can see the results of a change without having to close the object 
editor by clicking in a different text box. 


Hypertext links can be edited using the Link Editor. To open the Link 
Editor and edit a particular link: select the link in Edit Page mode and 
choose Link Editor from the View menu (Windows) or Show Link Editor 
from the Window menu (Macintosh). 


URL: | [x] 
Browse Files... | Remove Link Show Examples | 
> xh 
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The Link Editor is displayed in an expandable window. Click the 
triangle > on the bottom section of the window to display more 
information. 


Resizing elements using the mouse 


Besides using the object editors, you can resize many of the elements in 
your page, such as tables, images, frames, and form elements, using the 
mouse. 
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To resize an element using the mouse: 


1. Select the element. 


ay The element is highlighted with a border that includes one or 
ee, more handles. 


2. Drag the bottom handle to change the height of the element, drag the 
right-side handle to change the width of the element, and drag the 
lower-right comer handle to change the height and width of the 
element at the same time. 





To resize graphic elements proportionately, Shift-drag the corner 
handle. 


Aligning elements 


You can change the horizontal alignment of text, images, and other 
elements in relation to the Web page. 


To change the alignment of an element: 
1. Select the element and choose Alignment from the Format menu. 


2. Choose Align Left, Align Center, or Align Right from the submenu. 


You can also change the alignment of text and other elements using the 


Align Left [=], Align Center [=], and Align Right @&4 buttons on the toolbar. 


To align elements within a table cell, select the table cell that contains 
the element you want to align. In the Table Object Editor, click the Cells 
tab, and then select the appropriate option from the Horizontal Align or 
Vertical Align pop-up menu. For more information, see “Changing the 
alignment of elements in a table” on page 5-10. 


Previewing your work 


Claris Home Page provides you with different ways for checking your 
Web page after you’ ve worked on it in Edit Page mode. You can use 
Preview Page mode to preview the page in Claris Home Page, and 
Preview in Browser mode to view it in a browser that you specify. You 
can also use the Statistics window to get an estimate of download times 
for your page and elements on the page. 


For information about viewing the source tags for your page, see “Using 
Edit HTML Source mode” on page 2-16. 
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Using Preview Page mode 


When you switch to Preview Page mode, Claris Home Page displays 
your Web page the way it might appear in a browser. Keep in mind, 
however, that the appearance of your Web page may vary when 
displayed in different kinds of browsers. 


In Preview Page mode, you can test interactive elements of your Web 
page, such as links and certain form capabilities, and you can see how 
elements such as numbered lists will look in a browser. 


Note In Preview Page mode, all of the editing capabilities and some of 
the menu options are disabled. 


To switch to Preview Page mode, click the Preview Page button [§] on the 
Basic toolbar or choose Preview Page from the View menu (Windows) or 
the Window menu (Macintosh). 


Previewing your Web page in a browser 


In Claris Home Page, you have three preview choices for viewing your 
Web page in a browser. By default, Claris Home Page is set to open your 
page in Internet Explorer and Netscape Navigator. The third choice allows 
you to preview your Web page in all the browsers you currently have on 
your system. If you don’t have Internet Explorer or Netscape Navigator on 
your system, or if you want to see how your page looks in a different 
browser, you can change the default browsers. See “Changing the preview 
browser settings” next. 


To preview your Web page in a browser, do one of the following: 


= Choose Preview in Browser from the View menu (Windows) or the 
Window menu (Macintosh) and then choose a browser from the 
submenu. 


= Click the Preview in Browser button [@] on the toolbar and choose a 
browser from the pop-up menu. 


Note You can set Claris Home Page to automatically save changes in your 
page before previewing in a browser. Choose Application Options from the 
Tools menu (Windows) or Preferences from the Edit menu (Macintosh), 
click the General tab, and if necessary, select the Auto-save before running 
commands checkbox. 
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Changing the preview browser settings 


You can change the settings for both Preview in Browser options that 
Claris Home Page uses to display your Web pages. The name of the new 
browser appears in the Preview in Browser submenu. 


To change a default browser: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Browser Preview tab. 


3. Click Browse for either Preview Browser One option or Preview 
Browser Two option. 


An Open dialog box appears. 
4. Select the browser application and click Open. 

The name and path of your selection appears in the dialog box. 
5. Click Clear if you wish to change your choice back to the default. 


6. Click OK to close the Application Options (Windows) or Preferences 
(Macintosh) dialog box. 


Using the Statistics window 


The Statistics window provides estimates of how long it will take your 
viewers to download your Web page (or elements in your page) to their 
browser. You can check the estimated download time for a page you’re 
developing any time you are working with your page in Edit Page mode. 


Note The Statistics window displays estimates of download time under 
ideal conditions. Network congestion, server loading, or other adverse 
conditions can significantly increase the download time of your Web 


pages. 
To use the Statistics window: 


1. If you want to see statistics for a specific element or section of your 
Web page, select it first. 


2. Choose Document Statistics from the Tools menu (Windows) or from 
the Edit menu (Macintosh). 


The statistics window for the selected document appears. 
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Character Count: 16440 
‘Word Count: 2900 
Total Image Size: 69901 


Approximate Download Times 


14.4Kk 54 seconds 
28.8K 27 seconds 
33.6K <1 second 
56.0K <1 second 
ISDN <1 second 
1 <1 second 





3. Click the Document or the Selection tab and read the estimated 
statistics for the whole document or the section you’ ve selected. 











This statistic Provides this information 

Character Count Number of characters in your Web page or selection 

Word Count Number of words in your Web page or selection 

Total Image Size Number of bytes for all images in your Web page or in 
the section you selected 

Approximate Download Estimates of how long it will take a viewer to download 

Times your Web page or the section you selected using 


different modem speeds 
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Adding extra HTML to your page 


You can add extra HTML to your pages using Edit HTML Source mode 
and to specific elements in a page while you are working in Edit Page 
mode. You can also change some of the file output tags that Claris Home 
Page automatically inserts for you. There are several ways to add extra 
HTML to your Web pages: 


= Add attributes to an element in an object editor 
=» Add comments or HTML text 


= Add HTML to the Prefix Comments, HTML, HEAD, and BODY 
tags (the document tags) in Edit Page mode or Preview Page mode 


= Use Edit HTML Source mode to add extra HTML to the page 


= Change specific HTML output settings for all pages in 
Claris Home Page 


Using Edit HTML Source mode 


As you create your Web page in Edit Page mode, Claris Home Page 
inserts the HTML tags for you. You can view these tags and add your 
own HTML to it in Edit HTML Source mode. Claris Home Page saves 
and incorporates the changes you make. 


Important Be careful when editing your Web page in Edit HTML Source 
mode. Unless you are familiar with HTML and its syntax, you can 
destroy your work. As a precaution, make a copy of your Web page 
before you change it in Edit HTML Source mode. 


To switch to Edit HTML Source mode: 
= Click the Edit HTML Source button [fj on the Basic toolbar or choose 


Edit HTML Source from the View menu (Windows) or the Window 
menu (Macintosh). 


When in Edit HTML Source mode, the HTML menu appears on the menu 
bar, which contains options for setting the text display in this mode. 


Tip When you wish to edit an element in Edit HTML Source mode, first 
select the element in Edit Page mode and then switch to Edit HTML Source 
mode. This way you open to the exact location you want to edit without 
having to search for the element. 
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In Edit HTML Source mode, you can use all of the usual text editing 
operations such as typing, undoing, cutting, copying, pasting, dragging, 
and finding and replacing text. You can also change the display of text 
and HTML tags to make viewing it easier. Other options, such as those 
found in the Insert, Format, and Style menus, are not available in Edit 
HTML Source mode. 


Changing the text display in Edit HTML Source mode 


To make viewing easier, you can change the way HTML tags and text 
are displayed in Edit HTML Source mode. You can change the font type 
and font size of the source, use syntax coloring to distinguish tags from 
text, and use the word wrap option to temporarily break lines of text 
within the document window so you don’t have to scroll horizontally. 


To change the display in Edit HTML Source mode: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the HTML View tab. 
3. Make the appropriate selections and click OK. 


Body Text 
Plain 














<|-This sample text illustrates the effects of syntax hilightin 


<SELECT NAME="colors" SIZE=1> 
<OPTION SELECTED>Green 








2-18 Claris Home Page User’s Guide 











Preferences ——————— 
General [Images [Browser Preview | Fonts | HTML Yiew [HTML Source 


HTM Font: Cwora wrap 

& Use Syntax Coloring 

HTML Element: 
ste: coer 


<!--This sample text illustrates the effects of syntax hilight{a| 
<SELECT WAME="colors" SIZE=1> 
<OPTION SELECTED>Green 
<OPTION>Day-glo Orenge&trade: 
</SELECT> 


aa 























| 





























Claris Home Page displays a sample of text with your selections applied 
to it. Use the scroll bars to view your full settings. When Syntax Coloring 
is not selected, the sample text appears as black. 


To distinguish tags from text, use different colors and styles for them. 
Select Use Syntax Coloring, choose a tag type from the HTML Element pop- 
up menu, and select a color and style for that type. 


To change the font type and size of the source, choose them from the 
HTML Font pop-up menus. The settings apply to all pages you view in 
Edit HTML Source mode. 


To make temporary line breaks and turn off horizontal scrolling, select 
the Word Wrap check box. 


Note You can also turn Syntax Coloring and Word Wrap on and off 
from the HTML menu. 


To restore all the HTML Editing settings to their default values, click 
Use Defaults. 


Adding attributes to an element 
You can add extra HTML attributes to an element in Edit Page mode. To 
do this: 
1. Select the element you want to add an attribute to and then open its 
object or link editor. 


2. Click the Extended tab, if necessary, or the triangle > to show the Extra 
HTML Attributes text box. 
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3. In the Extra HTML Attributes text box, type the appropriate HTML and 
close the object or link editor. 


Claris Home Page adds the HTML to the element’s tag. 
Adding HTML to text 


You can add HTML code or comment to your text in a Web page to 
format special characters or insert a comment that is visible in the source 
on a browser (you can view it in Edit HTML Source mode). 


To add HTML to the text in your Web page: 
1. Choose HTML Code or Comment from the Insert menu. 


2. Type your code or comment in the text box. 


Adding HTML to the document tags 
You can add extra HTML attributes to the document tags for your 
Web page. 
To add attributes to a document tag: 


1. Choose Document Options from the Tools menu (Windows) or from 
the Edit menu (Macintosh). 


2. Click the Extended tab, and then type the HTML attributes in the 
appropriate text box. 


Type extra HTML 


in this text box To add 


Prefix Comments Commented text to the beginning of your HTML file, such as 
the name of the author, messages, and so on. 





<HTML> Tag Attributes Attributes to the <HTML> tag. Commented text that states the 
enclosed text is HTML and may contain two elements, HEAD 
and BODY, such as the title of a document, list elements, and 
so on. 


<HEAD> Tag Attributes Attributes to the <HEAD> tag. Commented text that contains 
general information about your HTML file, such as a record of 
the HTML file’s original URL, a relationship between files, 
and so on. 





Text in Head Section Text that appears in the HEAD section of the file. This option 
allows you to add tags other than <TITLE>. 





<Body> Tag Attributes Attributes to the <BODY> tag. Commented elements that 
contain the actual text of the HTML file, such as headings lists, 
addresses and so on. 
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3. Click OK to close the Document Options dialog box. 


The extra HTML you type in these text boxes only affects the current 
Web page you have open unless you have selected several pages using 
the Site Editor. To apply your changes to multiple pages, open the Site 
Editor (choose Open Site Folder from the File menu), select the pages you 
want to change, and make the appropriate option changes in the 
Document Options dialog box. 


Changing HTML output settings 


HTML output are automatically inserted for you. These application 
options affect the way a file is saved, and the type of HTML that Claris 
Home Page applies for text and hypertext links. 


You can change the default settings if you want to. Your change affects 
all pages that you create in Claris Home Page. 


To change the default HTML output settings: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the HTML Source tab, and then change the appropriate setting. 


Select this HTML 
output setting To do this 


Default HTML File Change the default filename suffix for new HTML files. Should 
Extension (Windows) _ typically be -htm or .html, for instance mypage.htm or 
or Suffix (Macintosh) |mypage.html. 





Header Comment Add information that identifies your pages as Claris Home Page 
files at the beginning of the HTML. (These comments are only 
visible when viewing the HTML source.) 


Choose None if you don’t want any information added. 


Choose Identify as Home Page file if you want a comment added 
identifying your Web pages as Claris Home Page files. 


Choose Identify and time-stamp if you want a comment added 
identifying your Web pages as Claris Home Page files and a time- 
stamp identifying the last time each file was saved. 





Line Break Format Specify the line break format your files will follow. Use this option 
only if you want to edit the HTML code of your Web page in a text 
editor since Claris Home Page can handle all line break 
conventions. 


Choose Macintosh (CR), Windows (CRLF), or Unix (LF) to specify the 
kind of line breaks you want to use. 
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Select this HTML 
output setting To do this 


Paragraph Alignment Specify how centered text is coded. 


ses Choose <CENTER> tag to have Claris Home Page use the 


<CENTER3> tag. 


Choose ALIGN attribute to have Claris Home Page use the 
ALIGN=CENTER parameter within other tags (such as <P>). 





Generate </P> Tags Add a closing paragraph tag to every opening paragraph tag in your 
files. This option is selected by default. 


Generate X-CLARIS — Claris Home Page uses several custom tags (beginning with “X- 

Tags CLARIS”) to save information such as where the Claris Home Page 
application window appears on the screen and what size the 
window is. Enable this option to display these additional tags in the 





HTML file. 
Use Absolute Specifies fixed pathnames for hypertext links between files based 
Pathnames on the computer where they reside. Because the pathnames do not 


change, links can be broken when files are moved to another 
computer. When this option is deselected, Claris Home Page uses 
relative pathnames based on the location of files that contains the 
links. 





Setting the color and background of your Web page 


You can change the color or use an image as a tiled pattern for the 
background of your Web page. When you use an image, it overrides the 
color setting. 


You can also specify a different color for the background of tables and 
table cells. See “Using the Table Object Editor” on page 5-3 for more 
information. 


Using the Site Editor, you can change several pages at one time. Choose 
Open Folder As Site from the File menu, select the pages you want to 
change in the Site Editor, and then follow these instructions to change 
the background of all selected Web pages. (See “Changing the color and 
background of a table” on page 5-11 for more information.) 


Changing the background color 
To change the color of your Web page’s background: 


1. Choose Document Options from the Tools menu (Windows) or from 
the Edit menu (Macintosh). 


The Document Options dialog box appears. 
2. Click the Appearance tab. 
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. Place the pointer on the Background Color box and hold the mouse 


button down until the pop-up color palette appears. 


. Select the color you want to use as the new background for your 


Web page. 


To select a color not found in the pop-up color palette, choose Other 
from the color palette, select the color you want to use, and then 
click OK. 


. Click OK to close the Document Options dialog box. 


The background color of your Web page changes. 


You can change the color palette that appears in the pop-up menu. Also 
note, however, that not all colors are supported uniformly by all Web 
browsers. For more information see “Changing the default color palette 
display” on page 2-23. 


Using an image for the background 
To use an image as a tiled background for your Web page: 
1. Choose Document Options from the Tools menu (Windows) or from 


the Edit menu (Macintosh). 


2. Click the Appearance tab. 
3. Click the Set button for the Background Image. 


An Open dialog box appears. 


4. Select the image file you want to use. 
5. Click Open. 





The path of the image file and a thumbnail representation of the 
image appear in the Document Options dialog box. 


>| 


6. Click OK to close the Document Options dialog box. 
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Note If you select both a color and an image for the background, the 
image overrides the background color unless image loading is turned off 
in the browser. 


To hide the background image in Edit Page mode: 


Background images normally display in Edit Page mode. To increase 
performance, you can set Claris Home Page to not display them in Edit 
Page mode. 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Images tab. 


3. Click the Display Background Images in Edit Mode check box to deselect 
the option. 


To remove an image from the background of your Web page: 


1. Choose Document Options from the Tools menu (Windows) or 
Document Options from the Edit menu (Macintosh). 


2. Click the Appearance tab. 
3. Click Restore Default Background. 


Changing the default color palette display 


You can change the color palette that appears for the color settings in the 
Document Options dialog box: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the General tab. 


3. Choose a new palette from the color palette pop-up menu and 
click OK. 


Also note, however, that not all colors are supported uniformly by all 
Web browsers. 
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Saving your Web page 


As in any application, it is important to save your files frequently to 
avoid the possibility of losing data. In addition, within Claris Home Page 
certain functions will only work after you have saved your Web page, 
for example switching to Preview Page mode or Preview in Browser 
mode. You can set Claris Home Page to automatically save a new page 
and give it a temporary filename whenever you switch modes. 


Claris Home Page save your Web page as an HTML file with the default 
extension of .htm. You can also save your page as a template file to reuse 
for creating other Web pages. 


To save a Web page: 


1. 


Choose Save from the File menu. 


The Enter Title dialog box appears the first time you save a new page. 
Enter a title and click OK. You can change the title later if you want. 
(For more information, see “Changing the title of your Web page” 
next.) 


The Save dialog box appears. 


2. Choose HTML File from the Save as type or File type pop-up menu. 


3. In the Filename or Save file as text box, type the filename for your Web 


4, 


page followed by the extension .htm for a Windows file or . html 
for a Macintosh file. 

In order for your files to be seen as Web pages in Claris Home Page 
and in Web browsers, they must have the .htm or .html extension. The 
text box provides a default name as “title” with the proper extension. 


Click Save. 


To change the filename extension that appears by default in the Save 
dialog box: 


1. 


Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the HTML Source tab. 
3. Type the extension in the Default HTML File Extension text box 


(Windows) or Default HTML File Suffix text box (Macintosh). 
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Changing the title of your Web page 
Claris Home Page prompts you to give your Web page a title the first 
time you save the document. Later you may wish to change it. The title 
of a Web page appears in the title bar at the top of most browser 
windows. This title can be different than the filename and does not need 
an HTML extension. You can see what the title is for your Web page in 
Preview Page mode. 


The words that appear in a Web page title are also used in searches by 
many Internet search engines. If it is important that viewers are able to 
find your Web page via keyword searches, make sure that the title 
includes words your viewers are most likely to use when doing the 
keyword search. 


To change the title of your Web page: 


1. Choose Document Options from the Tools menu (Windows) or from 
the Edit menu (Macintosh). 


2. Click the Parameters tab. 
3. Enter the title in the Document Title text box. 
4. Click OK. 


The new title appears in the title bar in Preview Page mode. 


Saving a page as a template 


You can save your Web page as a Claris Home Page template and use it 
for creating other Web pages. 


To save a Web page as a template: 
1. Choose Save As from the File menu. 


If you haven’t saved your Web page yet, the Enter Title dialog box 
appears. Enter a title and click OK. (For more information, see 
“Changing the title of your Web page” on page 2-25.) 


The Save dialog box appears. 


2. Select the Page Template folder located in the Claris Home Page 
folder. The file must be saved in this folder. 


3. Choose HTML Template from the Save as type or File type pop-up menu. 


4. In the Filename or Save file as text box, type the filename for your 
template followed by the extension . htm. 
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5. Click Save. 


A dialog box opens asking you to type a short description of the 
template. 


6. Type a descriptive name for the template and click OK. 


The name you type appears in a list of templates in the New dialog 
box the next time you start Claris Home Page. 


To use the template: 

1. Choose New from the file menu. 

2. Click Use Template and select the template in the list. 
A sample picture of the page appears on the left. 


Note If your template doesn’t appear in the list, exit Claris Home 
Page and then start the application again. 


3. Click OK to close the New dialog box. 


The template opens as a new untitled page. 


Auto-saving your files 


You can set Claris Home Page to automatically save a new page and give 
it a temporary filename whenever you switch to a preview mode. Claris 
Home Page will continue to save the file at the regular intervals you 
specified. 


To set the auto-save option: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the General tab. 


3. Specify how often (in minutes) you want Claris Home Page to save 
your files by selecting the Auto-save document every “#” minutes check 
box and typing a number in the text box. 


Time stamping your saved file 


When you save your Web page, Claris Home Page adds a header 
comment by default to the HTML source to indicate the date and time 
that you saved it and to identify it as a Claris Home Page file. This 
comment is only visible when viewing the HTML source. 
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You can change the default setting to remove the date and time stamp 
and just identify your pages as Claris Home Page files or to save all files 
without the header comment. 


To change the header comment setting: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the HTML Source tab. 
3. Choose a header type from the Header Comment pop-up menu. 


See “Changing HTML output settings” on page 2-20 for information 
about the other options in this dialog box. 


You can also place a comment of your choice that is only visible to you 
and not by browsers. Choose Comment from the Insert menu. Type your 
comment in the Comment dialog box your comment usually appears at 
the top of the page in Edit HTML Source mode. 


Printing your Web page 


You can use Claris Home Page to print the Web pages you create. You 
can print a page while in Edit Page mode, Preview Page mode, or Edit 
HTML Source mode and Claris Home Page will print your page as it 
appears in that particular mode. For example, table borders that are set 
to zero will print in Edit Page mode but not in Preview Page mode. 


To print your Web page: 
1. Choose Print from the File menu. 

Your system’s standard Print dialog box appears. 
2. Click OK (Windows) or Print (Macintosh). 


Claris Home Page prints the entire contents of your Web page file. 


Using the Site Editor 


The Site Editor is another type of editor found in Claris Home Page. The 
Site Editor displays information about all of the files that exist inside a 
site folder. 


To open the Site Editor: 
1. Choose Open Folder As Site from the File menu. 
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The Browse for Folder dialog box (Windows) or the select a Folder 
dialog box (Macintosh) appears. 


2. In the dialog box, navigate to the folder you want to define as the site 
folder and click OK (Windows) or Select “Folder Name” (Macintosh). 


The Site Editor opens and displays the site folder you specified and 
its contents. 


To use the Site Editor, select one or more pages and click a button on the 
toolbar or choose an option from the menus. To open a file from the Site 
Editor, double-click its icon in the list. If you double-click an image file, 
Claris Home Page opens it in the Image Object editor. 


To perform this task Do this 


Open a page that’s listed in the Site Editor | Double-click its name in the list. 





Create a new page 


Set document options for one or more pages 


Click the New Page button §] on the toolbar. 


Select the filenames in the list and click the 
Document Options button from the Site Editor 
toolbar. 





To check the links in your Web pages before 
you upload the files 


Click the Verify Links/References button [J in 
the toolbar to display the Verify Links/ 
References dialog, and then click OK. 





Consolidate the image files 


Upload individual files or an entire site to a 
remote server 


Click the Consolidate button [44 in the toolbar 
to display the Consolidate dialog box, and 
then click Consolidate. 


Select only the files you wish to upload, and 
then click the Upload button [%J in the toolbar 
to display the Upload dialog, and then click 
OK. To upload the entire site, click Entire Site 
in the Upload dialog box. See chapter 11, 
“Uploading your pages to a Web server” for 
more information. 
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Entering text 


Claris Home Page lets you work with text in some of the ways that you 
would in a standard word processor. You can type text, cut and paste text 
from another page or another document, find and replace text, and check 
your spelling. You can use several levels of headings, apply styles, 

change the size of text, change the text font, and change the color of text. 


Be aware, however, that HTML imposes certain limitations on your text 
formatting. For example, HTML doesn’t let you change spacing 
between words or lines, add tabs, or change how words are hyphenated. 
Other limitations arise because all browsers and platforms are not alike. 
If a browser window is set to a different size, the layout you carefully 
arranged on your page may look considerably different. Although you 
can’t predict exactly how text will appear to your audience on the Web, 
you can test the appearance of text on different browsers they are likely 
to be using. 


You can add text to your Web page by typing it directly onto the page, 
by copying and pasting it from another Web page or application, or by 
dragging it from another page in your Web site. On the Macintosh, you 
can drag text from another application as well. (See “Cutting, copying, 
and pasting” on page 2-7 for more information about copying elements 
in a Web page.) 


You can delete text by selecting it and pressing Delete, and cancel your 
last action by choosing Undo from the Edit menu or pressing Ctrl-Z 
(Windows) or #-Z (Macintosh). 


As you type, the lines of text in a paragraph run continuously and wrap 
evenly regardless of the size of your window. The text you type also 
wraps evenly in a Web browser window no matter what size it is. 


Press Enter (Windows) or Return (Macintosh) to end a paragraph of 
text and insert a paragraph break. Claris Home Page adds an extra line 
after each paragraph. If you want to make a paragraph break without 
adding the extra line, choose Line Break from the Insert menu or press 
Shift-Enter (Windows) or Shift-Return (Macintosh). 
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Note Claris Home Page shows line break symbols by default in Edit 
Page mode. To hide the line break symbols, choose Application Options 
from the Tools menu (Windows) or Preferences from the Edit menu 
(Macintosh) and click the General tab. Click to deselect the Show Line 
Breaks check box, and click OK. 


You are important to us! By taking time to fill out this short questionnaire, you help us 
expand our list of products and serve you better. + 
Please enter your answers to the questions below in the entry fields provided. Then click 
the Submit button at the bottom of this page to send your comments directly to us. If you 
want to delete your comments in all fields and begin again, click Reset. 1 

Line break symbol 


Opening a text file from another application 


You can open text files that you created in other applications and apply 
HTML formatting styles to them in Claris Home Page. 


To open a text file in Claris Home Page: 
1. Choose Open from the File menu. 
Select the text file in the Open dialog box. 


Windows: Choose Text Files from the Files of type pop-up menu and 
navigate to the folder where the text file is located. 


Macintosh: Only HTML and text files appear in the Open 
dialog box. 


2. Click Open. 
The text file appears in Edit Page mode. 


Note You can also copy text from another application and paste it in an 
untitled Claris Home Page document. 


Finding and replacing text 
You can find and replace strings of text, including text characters, 


words, phrases, and keyboard symbols, such as the ampersand (&). 


To find and replace text: 
1. Choose Find/Change from the Edit menu. 
The Find/Change dialog box appears. 
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Search In: |Top Page v In Edit Mode ow 
Find: [ 
Change To: [0] 


C Case Sensitive CO Search Backwards 
CO Whole Word {] Wrap Around 


Find Next 





2. Type the text you want to find in the Find text box. 


3. If you want to replace the found text, type the replacement text in the 
Change text box or if you want to delete the found text, leave this 


box empty. 


4. Select the options you want to use. 


Select this option 


Search In 


To do this 


Select the page you want to search in. Search the Top Page, All 
Open Pages, and All Pages In All Open Sites. Using the Site Editor 
you can also Selected Pages In The Top Site, All Pages In The Top 
Site, and Selected Pages In All Open Sites. 





In Edit Mode 
In HTML Mode 


Case Sensitive 


Select the mode you want to search in. Search In Edit Mode to 
find the a match in Edit Page mode only. Search In HTML Mode 
to find a match in Edit HTML Source mode only. 


Only find exact matches of the text, including case. For 
example, “Coffee” would find “Coffee” but not “coffee.” 
Leave unchecked to ignore case. 





Whole Word 


Only find the text if it appears by itself without any other 
characters. 





Search Backwards 


Search backward from the insertion point instead of forward. 





Wrap Around 


Search through the page again. 
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5. Click the appropriate button to perform the search. 











Click this button To do this 

Find Next Find the text you typed in the Find text box. 

Change All Replace all instances of the found text with the text you typed 
in the Change text box. 

Change After a successful find, replace the found text. 

Change, Find After a successful find, replace the found text and search for 


the text again. 





Choose Find Next from the Edit menu if you want to find the same text 
again without reopening the Find/Change dialog box. 


Applying styles to text 


Use Claris Home Page to apply standard HTML formatting styles to 
paragraphs and to individual characters or words easily. In Edit Page 
mode, choose a style and Claris Home Page adds the appropriate HTML 
tags to the text or paragraph for you. 


Using paragraph styles 
You can use paragraph styles to format different level headings, lists, 
quotes, and bylines and to align paragraphs to the sides of the page. 


When you apply a paragraph style, the change affects all of the text 
within the paragraph. In most cases, if text within the paragraph already 
has a character style, it adopts the paragraph style in addition to the 
character style. For example, if you make the first word in a paragraph 
italic and then make the paragraph into a heading, the first word is still 
set in italic. 


To apply a paragraph style: 
1. Select the paragraph or group of paragraphs you want to format. 


2. Choose the style from the Format menu. 


Choose one 
of these styles To do this 
Normal Remove any Heading, Preformatted, Address, or List styles 


from a paragraph. 
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Choose one 
of these styles To do this 


Preformatted Format the text of the paragraph to display in the monospace 
font used by the Web browser. This causes all of the 
characters typed to have the same width so you can use 
multiple spaces to line up text exactly how you want it to look. 


Note Tables are more useful for presenting text in multiple 
columns as long as the browser supports tables. For more 
information on tables, see chapter 5 “Adding tables to your 
Web page.” 





Address Format your byline or address so your audience can find 
it easily. 


Note Bylines and the email address of the Web page author 
are usually placed at the bottom of the Web page, separate 
from other text. 


Headings 1-6 Format text with six different heading levels, where 
Heading | is the largest and Heading 6 is the smallest. 





Bullet List, Definition List Format paragraphs into a list of items. You can choose from 

(Term and Definition), or several different types of lists depending on the information 

Numbered List you are presenting. For more information, see “Creating a 
list” on page 3-9. 














Number List Style Label the numbered list items using alphabetic or numeric 
characters. 

Increase Indent Format a paragraph as an extended quotation by indenting 
both the left and right sides of the paragraph. Uses the 
<BLOCKQUOTES tag. 

Decrease Indent Remove the indentation of the paragraph. Removes the 
<BLOCKQUOTES tag. 

Alignment Align text to the left side, center, or right side of the 


Web page. Choose Align Left, Align Center, or Align Right from 
the submenu. 


Using character styles 


Claris Home Page provides styles for applying HTML attributes to text 
characters. Character styles include physical and logical character 
styles, and Font, Size, and Text Color. 


Characters formatted with a physical style (such as Bold, Italic, or 
Strikethrough) look the same no matter what browser they appear in as 
long as the browser supports that physical style. (If a browser doesn’t 
support the style, then there’s no way of knowing how the characters 
will be interpreted.) 
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Characters formatted with a logical style appear differently depending 
on how a browser interprets that style. For example, characters 
formatted with the Emphasis style might appear in italics in one browser 
while in another browser they might appear underlined. This allows for 
more flexibility between browsers. 


Here is how Claris Home Page displays the logical styles it supports. 


Remember, they may look different in other browsers. 


Strong Zmphasis Citation Inserted Deleted 


Sample Keyboard Variable Code 


To apply a character style: 
1. Select the characters you want to format. 


2. Choose one or more character styles from the Style menu. 


Type of Choose one of 
character style _ these styles To do this 
Physical styles Plain Remove all physical and logical character 


styles, such as Bold. Does not affect Font, Size, 
or Text Color. 




















Bold Make text bold. 

Italic Make text italic. 
Underline Make text underline. 
Strikethrough Make text strikethrough. 
Superscript Make text Superscript. 
Subscript Make text subscript. 





Teletype Make text teletype. 
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Type of Choose one of 

character style _ these styles To do this 

Logical styles Strong Indicate the text is very important. 

(choose Other - 

from the Style Emphasis Indicate the text is important. 

mienu) Citation Indicate that the text is from a book or other 
document. 

Inserted Indicate that the text has been inserted into the 
document. 

Deleted Indicate that the text has been deleted from the 
document. 

Sample Indicate that the text is a sequence of literal 
characters. 

Keyboard Indicate that the text is keyboard input. 

Variable Indicate that the text is a variable. 

Code Indicate that the text is code. 

Font None Make text display in the default font of the Web 
browser. 

Other Type a list of fonts separated by commas (for 
example, Helvetica, Ariel, Courier). 
The text will display in the first listed font 
found on the browser’s system. 

(Font name) Make the text display in the font specified. (If 
the font is not available on the browser’s 
system, another font will be substituted.) 

Size 1 through 7 (3 is — Format text with 7 sizes where 7 is the largest 
the default) size and | is the smallest. 

Increase Format text with the largest size (same as 7). 

Decrease Format text with the smallest size (same as 1). 

Text Color Black, White, Make the text a different color. For more 


Gray, Red, Blue, 
Green, Magenta, 
Cyan, Yellow, 
and Other 


Removing paragraph or character styles 


To remove a paragraph style, you reset the selected text back to Normal. 
Select the text and choose Normal from the Format menu. (Character 
styles remain unaffected.) 


information, see “Changing the color of text” 
on page 3-14. 


To remove all character styles from text, select the text and choose Plain 
from the Style menu. 
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Changing how text is displayed in Claris Home Page 


To make working with text easier, you can change how text is displayed 
in Edit Page and Preview Page modes without affecting the actual 
HTML formatting styles of the text. 


Note This procedure does not change the way text is displayed in your 
Web pages on the Internet. 


To change how the text is displayed in Claris Home Page: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Fonts tab. 
3. Choose a font type and size. 


Change the proportional font settings to set how normal or plain text 
appears. Change the monospaced font settings to set how text appears 
in form fields and with the Preformatted or Teletype styles. 


Note The default display font setting is Times, 12 points. 


Formatting special characters 


Characters that require more than one key to type, such as the copyright 
symbol (©), are not guaranteed to appear in all browsers or on all types 
of computers. To ensure special characters like this appear in your Web 
page, you type numeric entities assigned by the International Standards 
Organization (ISO) in the HTML Code text box. For example, the numeric 
entity for the copyright symbol is &#169;. The actual character appears 
when you preview the page in a browser or after you close and reopen 
the page in Claris Home Page. 


For a complete list of the ISO Latin-1 character set and the assigned 
numeric entities, see appendix A, “Codes for special characters.” 


To enter a special character: 
1. Switch to Edit Page mode, if necessary. 


2. Place the insertion point where you want the special character to 
appear. 


3. Choose HTML from the Insert menu and then choose Code. 


An HTML Code icon appears in your page and the HTML Code 
window opens. 





1997 Claris Corporation 


Browser view 
1997 Claris Corporation 


Edit Page mode view 


Creating a list 
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4. Type &#, the number for your special character, and a semicolon (;) 
in the HTML Code window. 


When you add &# before the number, the number is recognized as a 
numeric entity for a special character. 


-=3 HTML Code 


&*169; : 


(J Include <!--NOEDIT--> Marker 





5. Click the close box of the HTML Code window. 


The HTML Code icon remains as a placeholder for the code you 
assigned. The special character appears when you view your page in 
a browser, and it also appears in Claris Home Page the next time you 
open the file. 


To enter in HTML code as a comment, click the Include<!--NOEDIT--> 
Marker checkbox. When checked, Claris Home Page will not convert 
the HTML code between the comment lines. 


There are several ways you can format text to help you organize 
information on your Web page. Using lists is one popular method. You 
can create three kinds of lists using Claris Home Page: bulleted, 
definition, and numbered lists. 


The first step in creating a list on your Web page is deciding which kind 
of list to use. 





Use this kind of list For this type of information 

Bulleted list Items that don’t necessarily follow a sequence (also known 
as an unordered list). In this kind of list, a bullet precedes 
each item. 

Definition list Terms that might be unfamiliar to the user. Definition lists 


consist of terms that are followed by their definitions. 





Numbered list Items that need to be listed in a sequence (also known as an 
ordered list). In this kind of list, a number or letter precedes 
each item, which you can specify. 
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Note When you create a numbered list in Edit Page mode, you see a 
number symbol (#) or an X in front of each entry. The actual numbers or 
letters only appear when you view your page in Preview Page mode 

or in a browser. 


Creating a bulleted list 


To create a bulleted list: 
1. In Edit Page mode, type the list items, starting each item on a new line. 
2. Select the list. 


3. Choose Bullet List from the Format menu or click the Make Bullet List 
Entry button on the toolbar. 


Note You can also start a new bulleted item by clicking anywhere in the 
text and choosing List from the Insert menu. 


To add an item to a list, click in the list where you want to begin a new 
item and press Enter (Windows) or Return (Macintosh). 


Creating a numbered list 


This is a numbered list: 
£ Item 


£ Item2 
£ Item3 


Edit Page mode 
This is 4 numbered list: 
1. Itm1 


2. Item2 
3. Item3 


Preview Page mode 





To create a numbered list: 

1. In Edit Page mode, type the list items, starting each item on a new line. 
2. Select the list. 

3. Choose Numbered List from the Format menu. 


Note You can view the results of a numbered list in Preview Page 
mode or in a browser. 


To add an item to a list, click in the list where you want to begin a new 
item and press Enter (Windows) or Return (Macintosh). 


There are five number styles you can use for a numbered list. 


To change the number style: 
1. Select the numbered list. 


2. Choose Number List Style from the Format menu and select a number 
or letter style. 


In Edit Page mode, you see number symbols (#) or X’s in the list. You 
can view your page in Preview Page mode or in a browser to see the 
actual numbers or letters. 
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Creating a definition list 


To create a definition list: 


1. 
2. 


Choose Definition List from the Format menu and then choose Term. 


Type the first term and press Enter (Windows) or Return 
(Macintosh). 


The insertion point is indented and the format changes to Definition. 


. Type the definition for the first term and press Enter (Windows) or 


Return (Macintosh). 


The insertion point moves back out to the left margin and the format 
changes to Term. 


Repeat steps 2 and 3 for each glossary term and definition you want 
to create. 


Tip You can tell what the format is for text by clicking the text and 
looking at the pop-up menu on the toolbar. The format name changes 
in the pop-up menu when you click a paragraph that has a different 
format. 


To add an item to a list, click in the list where you want to begin a new 
item and press Enter (Windows) or Return (Macintosh). 


Creating a nested list 


® Flavors 
® Orange 


A nested list is indented within another list to show subcategories. 


© Chocolate To create a nested list: 


® Irish Creme 
@® Hazelnut 1 
® Yanilla Nut 

® Flavor Sample Pack 


. Type the list and the subcategory list, starting each item on a new line. 


© Specialty Teas 2. Select all of the text. 
@ Few 3. Choose Bullet List from the Format menu. 
5 es 4. Select the subcategories you want to nest. 
© Irish Creme . 
© Hazelnut 5. Click the Increase Indent button [3] on the toolbar. 
© Yanilla Nut 
o Flavor Sample Pack 
© Specialty Teas To remove the nested list style, click the Decrease Indent button [3]. 


Reordering items in a list 


You can drag list items to a new position in the list. 
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To select a single list item that you want to reposition, you need to select 
the entire item (including the paragraph return at the end of the line). 


1. Triple-click the item you want to move. 


If you want to move more than one item at a time, hold down the Shift 
key and select the other items. 


2. Drag the selected item or items into the left margin of the new location. 


Note If you change the order of numbered list items, they’re renumbered 
automatically. 


Checking your spelling 


Claris Home Page provides a spelling checker to help you polish your 
writing. You can check the spelling of all the words in the page you’re 
working on and check individually selected words. You can also use the 
spelling checker to count the number of words in your Web page or 
selection. 


To check the spelling Do this 


In a page Choose Spell and then Check Spelling from the Tools menu 
(Windows) or Edit menu (Macintosh). 





In selected text Select the words you want to check, and then choose Spell and 
then Check Selection from the Tools menu (Windows) or Edit 
menu (Macintosh). 





Once you choose one of these options, the Spelling dialog box appears 
and Claris Home Page begins checking for questionable words. 


The spelling checker verifies the words you are checking with those in 
the main dictionary (that is installed in the Claris folder, see chapter 1, 
“Installing Claris Home Page” in the Getting Started guide that 
accompanied your application) and with whatever is the currently 
selected dictionary. If it does not find a word that matches, it suggests 
alternatives. If the spelling of the word in question is correct (such as the 
spelling of someone’s name), you can add the word to a user dictionary 
by clicking Learn if you already have created a user dictionary. 
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Cresiace ] 











Learn 





Cancel 


Status: Questionable Spelling 0 words checked 
O Questionable Words “7 





«he world. We have a wwide selection to choose from and we guarante <. Shows questionable words in context 








Click the triangle =~ to display the questionable word in context in the 
bottom of the spelling dialog box. 


Use this option To do this 


Replace Click to replace the questionable word with the word 
selected in the list (changes to Done when check is 
complete). Type a keyboard shortcut (shown to the left of 
the word) to replace a word. 


Check Type the text in the Word text box you want to check. 
Click Check. The spelling of the word is checked and if 
questionable, a list of optional words appear. 





Skip Click to keep the word in question as is and move on to 
another selection. 














Learn Click to add the questionable word to the user dictionary. 
Cancel Click to stop the spelling checker. 

Words checked Learn how many words are in the selection or document. 
Questionable words Learn how many questionable words are in the document. 





Questionable word in context See the questionable word in context. Click the triangle to 
text box hide or show the word in context. 





Changing dictionaries 


To change the dictionary that Claris Home Page is currently using, 
choose Spell from the Tools menu (Windows) or Edit menu (Macintosh), 
and then select Select Dictionaries. 
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Editing dictionaries 
To edit words in your user dictionary, choose Edit User Dictionary from 
the Edit menu. In the dialog box, you can add a new entry to the 
dictionary, remove entries from the list, edit dictionary entries, import 
dictionary entries from a text file, or export the contents of a dictionary 
to a text file. 





User Dictionary: User Dictionary 
15th 

abider 

abstractable 


accreditable 
acronymic (0K) 


afterclap 





Use this option _To do this 




















Add Add the entry to the dictionary 

Remove Remove a selected entry from the dictionary 

OK Apply your changes to the user dictionary and close the dialog box. 
Cancel Close the dialog box without making any changes to the user dictionary. 
Entry Type a new entry or edit a selected entry. 

Import Import entries from another dictionary. 

Export Export entries from another dictionary. 





International ProofReader text proofing software © 1995 by Inso 
Corporation. All rights reserved. Reproduction or disassembly of 
embodied algorithms or database prohibited. 


Changing the color of text 


You can change the color of all of the text on your Web page and you 
can change the color of selected text. Colors assigned to selected text are 
character styles and therefore override the default color you assign for 
all text on your Web page. 
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You can also change the color of hypertext links. See “Changing the 
color of links” on page 7-14. 


Note Not all colors are supported uniformly by all Web browsers. 


Changing the default color of text 
To change the default color for all the text on a Web page: 


1. Choose Document Options from the Tools menu (Windows) or Edit 
menu (Macintosh). 


The Options dialog box appears. 
2. Click the Appearance tab if necessary, to see a new set of options. 


Pee) tres 





untitled.html Options 


Text Color Background 


Text: [MJ] Color: 


1 Link: [I] 
Normal Link: 

| s 
Visited Link: [i] ie 
Active Link: [IL] 


Restore Default Colors Restore Default Background 














3. Place the pointer over the Text box in the Text Color area and hold the 
mouse button down until the pop-up color palette appears. 
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Note You can change the default color palette that appears. See 
“Changing the default color palette display” on page 2-23 for more 
information. 


4. Select the color you want for the text. 
5. Click OK to close the Options dialog box. 


To change the color of all text on your page back to the default settings: 


1. Choose Document Options from the Tools menu (Windows) or from 


the Edit menu (Macintosh). 


2. Click the Appearance tab. 
3. Click Restore Default Colors, and then click OK. 


Your links revert to their default color and any text not assigned a 
specific color character style reverts to the text default color. 


Changing the color of selected text 


To change the color of selected text: 


1. Select the text in your page. 
2. Choose Text Color from the Style menu or click the Text Color button 


[a@] on the toolbar and then choose one of the pre-defined colors or 
choose Other for more options. 


If you choose a pre-defined color, the color is applied to the text you 
selected. 


If you choose Other, a Color dialog box appears. Click on the color 
you want, and click OK to apply the new color to the text. 


Windows: If you want to define a custom color, click Define Custom 
Colors in the Color dialog box. For more information on how to set a 
custom color, consult your Windows documentation. 


Macintosh: If you want to define a custom color, click More Choices 
in the Color dialog box. For more information on how to set a custom 
color, consult your Macintosh documentation. 


To change the color of selected text back to the default color, choose Text 
Color from the Style menu, and then choose Default. 
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Using horizontal rules to separate text 


You can use horizontal rules to separate your Web page into sections. 
Horizontal rules are objects that you can resize to be short or long, thick 
or thin. 


Inserting a horizontal rule 


You can insert horizontal rules anywhere in your page including inside 
table cells. To insert a horizontal rule: 


1. Place the insertion point where you want the horizontal rule to appear 
in the page. 

2. Choose Horizontal Rule from the Insert menu or click the Insert 
Horizontal Rule button E] on the toolbar. 


Claris Home Page inserts horizontal rules of a size commonly used 
by many Web page designers. 


Changing the attributes of the horizontal rule 


You can change the size and alignment of the horizontal rule and make 
it look like a solid line or recessed in the page 


To change the attributes of a horizontal rule: 


1. Double-click the horizontal rule to open the Horizontal Rule Object 
Editor. 





[Percent [i 


Appearance 
Height: 
width: 
Alignment: &] Shade 
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2. Click either the Appearance or Extended tab to change the settings as 
appropriate, and then apply the settings by pressing Tab or clicking 
the close box of the Horizontal Rule Object Editor. 


Use this horizontal 
rule attribute setting 


Height 


To do this 


Change the thickness of the rule. 





Width 


Change the length of the rule. Choose Percent to make the 
length a percentage of the browser window’s width. Choose 
Pixels to make the length a fixed amount that is not affected 
by the browser window’s width. 





Alignment 


Change the alignment of the rule to the left side, right side, or 
center of the paragraph or page. 





Shade 


Make the rule look recessed. Deselect to make the rule solid. 





Extra HTML Attributes 


Add other HTML attributes to the horizontal rule. (This is an 
advanced feature that requires knowledge of HTML; it 
specifies additional parameters for the <HR> tag. For more 
information, see “Adding extra HTML to your page” on 
page 2-16. 





Tip You can also use the mouse to change the thickness of a horizontal 
tule. Click the rule to select it and drag the handle at the bottom of the 


rule up or down. 


Chapter 4: Adding images to your Web page 





Images that you include on your Web pages can be simple line art or 
color photographs. You can use an image for visual effect alone, or 
make it function as a clickable link. Make an image interlaced so that 
your audience can see more of the image as it’s downloading onto their 
computers. Add a single transparent color to an image to make parts of 
it (like the background) disappear. You can even use an image to create 
a background pattern for your Web page. (For more information, see 
“Using an image for the background” on page 2-22.) 


Images that you include on your Web page must be in one of the two 
standard formats used on the Web: JPEG (Joint Photographic Experts 
Group) or GIF (Graphics Interchange Format). Claris Home Page 
converts image files in other formats to GIF for you. 


Claris Home Page comes with a library of GIF images to use on your 
Web pages. You can also create your own libraries of images. For more 
information, see chapter 6, “Using Claris Home Page libraries.” 


When you’re deciding where to include images on your Web pages, 
keep in mind that some browsers don’t support images and sometimes 
people turn off image loading in their browsers. You can specify an 
alternative label that appears in place of the image in these cases. 


Web pages with large image files take longer to download. As you add 
images to your Web page, you can check how long it will take browsers 
to download. For more information, see “Using the Statistics window” 
on page 2-14. 


When you’re ready to upload your pages to the Web, you can use Claris 
Home Page to consolidate all the referenced image files into one folder. 
See “Consolidating media files” on page 12-4 for more information. 
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Inserting an image 


When you insert an image into your Web page, Claris Home Page 
creates a pointer to the folder where the image file is stored. Before you 
add images to your Web pages, make sure the image files are stored in 
the images folder that you have set up for your Web site (see “Setting up 
the media folder” on page 1-9 for more information). Then set the 
images folder to be the default location where Claris Home Page stores 
converted files. (See “Specifying the default converted images folder” 
on page 4-3.) 


To insert an image into your Web page: 
1. Place the insertion point in the page where you want the image to appear. 


2. Choose Image from the Insert menu or click the Insert Image button 
on the toolbar. 


You can also add an image to your Web page by dragging it. 
3. In the Open dialog box, select the image file and click Open. 
The image appears on the Web page. 


If the image is a JPEG or GIF file, Claris Home Page creates a pointer 
to the current location of the file. If the image is in a different file 
format (such as BMP, TIFF, or PICT), Claris Home Page converts the 
file to GIF format. 


Note To view JPEG images that you insert into Claris Home Page on the 
Macintosh, you need QuickTime 2.0 or later installed on your computer. 
Your audience won’t need this application if their browsers support 
JPEG images. 


Converting image files to GIF format 


Claris Home Page automatically converts image files such as PICT and 
BMP files into GIF format when you insert them into a page. 


When Claris Home Page converts an image, it automatically stores the 
converted image file in the Claris Home Page folder. You can set the 
default so that images are automatically stored in your images folder in 
the site folder, or you can also have Claris Home Page prompt you for a 
filename and location each time it converts a file. You can also set Claris 
Home Page to automatically add an interlacing effect to the converted 
images. For a description of what the interlacing effect does, see 
“Creating an interlaced image” on page 4-8. 
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Specifying the default converted images folder 


To set the default location where Claris Home Page stores the converted 
GIF files: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Images tab to display a new set of options. 


Peck eed 





General Images | Broviser Preview| Fonts | HTML Editing | HTML Output | 


I Make Intetlaced GIFs Image Map Format: [CERN >] 
Prompt for Fle Name/Location 

Display Images in Edit Mode 

F Display Background Images in Edt Mode 

T Easter Image Display (may not work with al video cards) 





Converted Images Directoy: Set. 














Help Lok] ence! 








ee Preferences 





General | Images |[ Browser Preview _|[ Fonts |[ HTML Editing |{ HTML Output | 

& Make Interlaced GIFs Image Map Format: [NCSA v 
& Prompt for File Name/Location 

&] Display Images in Edit Mode 

& Display Background Images in Edit Mode 


Converted Images Folder: 


Macintosh HD:Applications:Claris Home Page 2.0: 














Caner C7 








3. Select Convert and save automatically to directory (Windows) or Convert 
and save automatically to folder (Macintosh). 


4. Click Browse to select the folder you want the converted images 
stored in. 


5. Click OK. 
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Specifying each filename and location 


To set Claris Home Page to prompt you for a filename and location each 
time it converts an image file to GIF format: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Images tab. 
3. Select Prompt for File Name/Location and click OK. 


When Claris Home Page converts a file, it prompts you to assign a 
filename and a location for the converted file. 


Note When Claris Home Page converts Photoshop or TIFF files, it 
automatically adds the word (converted) to the filename. 


Automatically interlacing converted images 


When Claris Home Page converts an image into GIF format, an 
interlacing effect is applied to the converted image. You can change the 
default setting so that Claris Home Page does not automatically make 
every image it converts to GIF interlaced as well. For more information, 
see “Creating an interlaced image” on page 4-8. 


To remove the default interlacing for converted images: 


1. Choose Applications Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


2. Click the Images tab to display a new set of options. 
3. Deselect the Make Interlaced GIFs check box. 
4. Click OK. 


Note This setting only affects GIF files that Claris Home Page 
automatically converts from other image file formats, such as PICT or 
BMP files. 
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Usingthe Image Object Editor 


Once you’ ve added an image to your page, you can use the Image Object 
Editor to change the attributes of your image. You can change the 
appearance of an image (such as the size and alignment), add special 
effects to it, and make it behave as a form button or an image map. You 
can also use the Image Object Editor to locate the file if the reference 
link to it is broken. 


Note You can also make an image into a single hypertext link that you 
can click to go to a different page. For more information, see chapter 7, 
“Creating links and anchors.” 


You can open the Image Object Editor three different ways: 


= Double-click an image. 


= Click an image, and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu (Macintosh). 


= Click an image, and click the Object Editor button [By on the toolbar. 











Appearance 


Location: [+ 
aittabel:[ 
width: [| 
Hetant: [—] 
Border: | Pixels 
Alignment: 
Transparency and Interlacing: 
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To change the attributes of an image, select the image and then change 
the settings in the Image Object Editor. Click the Appearance tab to see 
more options. To apply the new settings, press tab or click the close box 
on the Image Object Editor. 


Use this 
Appearance setting _To do this 


Location Locate and re-establish the reference link to a missing file. The 
Location text box displays the path of the reference link to the 
image file. Click Browse to select a new path. 





Alt Label Type the text that appears in place of the image if a Web browser 
doesn’t support images or if your viewer has turned image loading 
off. You should always provide an alternative label for important 
images. 





Width Change the width of the image. Choose Percent to make the width 
a percentage of the browser window’s width. Choose Pixels to 
make the width a fixed amount that is not affected by the browser 
window’s width. For more information, see “Setting the image 
size” next. 





Height Change the height of the image. Choose Percent to make the height 
a percentage of the browser window’s height. Choose Pixels to 
make the height a fixed amount that is not affected by the browser 
window’s height. For more information, see “Setting the image 





size” next. 
Original Size Restore a resized image back to its original size. 
Border Change the thickness in pixels of the border around the image. A 


setting of 0 makes the border around the image invisible. 





Alignment Change how the image is aligned with text in a line or on the page. 


Choose Top to align the top of the image with the top of the text 
next to it. 


Choose Middle to align the middle of the image with the text next 
to it. 


Choose Bottom to align the bottom of the image with the bottom 
of the text next to it. 


Choose Left or Right to place the image on the left side or right side 
of the page and have text flow around it. (View your page in a 
browser to see the actual left and right alignment of the image 
within text.) 





Transparency and Click Set to make a GIF image interlaced or to add transparency 

Interlacing to a GIF image. See “Creating an interlaced image” on page 4-8 
and “Adding transparency to an image” on page 4-9 for more 
information. 
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To change the behavior of an image, click the Behavior tab and choose a 
setting. For more information, see “Making images interactive” on 








page 4-10. 

Use this Behavior 

tab setting To do this 

Picture Change a form submit button or image map to a picture. 
Form Submit Button Make an image behave like a form submit button. 
Image Map Make an image behave like an image map. 


Click Edit to open the Image Map Editor so you can add hotspot 
links to the image map. See “Creating an image map” on page 7-8 
for more information. 





To add extra HTML attributes to an image, click the Extended tab and 
type the appropriate HTML. For more information, see “Adding extra 
HTML to your page” on page 2-16. 


Use this Extended 


tab setting To do this 
Extra HTML Type code for additional HTML attributes for your image. (This is an 
Attributes advanced feature that requires knowledge of HTML; it specifies 


additional parameters for the <IMG> tag. 





Setting the image size 


You can set the size of an image to rescale to the browser window’ size 
or to remain fixed as the window’s size changes. Whether you set an 
image to rescale in a browser depends on the type of image. For example, 
you may not want a photograph to rescale as your viewers resize their 
browser windows because it distorts the image, but you may want a simple 
border or dividing line to rescale as the browser window changes. 


To set the image size and how it adjusts to the size of a browser window: 
1. Double-click on the image to open the Image Object Editor. 

2. Click the Appearance tab to display a new set of options. 

3. Choose the setting type from the Width or Height pop-up menus. 


= Choose Percent to set the size as a percentage of the browser 
window’s width or height. 


= Choose Pixels to set the size as a fixed number of pixels that 
remains unaffected by the browser window’s size. 
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4. Type the number of pixels or percent for the image’s width or height. 
5. Press Enter (Windows) or Return (Macintosh). 


Tip Use the mouse to change the width and height of the image 
proportionately. Select the image, hold down the Shift key, and then 
drag the lower-right corner handle. 


To set the image to its original size, click the Original Size button in the 
Image Object Editor. 


Creating an interlaced image 


When a Web browser downloads a normal GIF image, the image 
gradually appears, line by line, from top to bottom on the screen. If an 
image is large and takes a long time to download, this can be frustrating 
for someone viewing it. Your audience might have to wait for almost the 
entire image to download before they really know what the image is. 


To avoid this problem, you can change an image so that it is interlaced. 
When a browser downloads an interlaced GIF image, a rough outline of 
the entire image is displayed first and then detail is gradually added. 


Note When Claris Home Page converts image files to GIF format, the 
images are automatically set to be interlaced. For more information on 
image conversion, see “Converting image files to GIF format” on 

page 4-2. 

To make an image interlaced: 

1. Double-click the image to open the Image Object Editor. 

2. Click the Appearance tab, if necessary, to display a new set of options. 


3. Click Set to open the image file in the Transparency and Interlacing 
Image Editor. 


4. Click the Interlace button [EJ on the toolbar. 


To change the image back into a non-interlaced image, click the Don’t 
Interlace button EJ. 


5. Close the Transparency and Interlacing Image Editor and save the 
changes to the image file when Claris Home Page prompts you to. 


The image file is stored and displayed as an interlaced image. 
Tip To open the image in the Transparency and Interlacing Image Editor 


using the mouse, right-click (Windows) or Control-click (Macintosh) 
the image and choose Transparency and Interlacing from the pop-up menu. 
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Adding transparency to an image 


You can make a single color in an image transparent so the background 
of the Web page shows through. This is useful for making the 
rectangular background and outline of an image disappear. It can also be 
useful for controlling the space between objects or lines of text with an 
invisible image. 


To make the background of an image transparent: 


1. If necessary (such as with most scanned images and photographs), 
use an image-editing program to make the image background a single 
color and then add the image to your Web page. 


2. Select the image and open the Image Object Editor. 
3. Click the Appearance tab to display a new set of options. 


4. Click the Transparency and Interlacing Set button to open the image file 
in the Transparency and Interlacing Image Editor. 


5. Move the pointer over the image until it turns into an eyedropper, and 
click to select the color of the image you want to make transparent. 


All pixels of the selected color become transparent. 
Note You can only make one color transparent in an image. 


6. Close the Transparency and Interlacing Image Editor and save the 
changes to the image file when Claris Home Page prompts you to. 


The color you selected in the image becomes transparent so you can 
see the background of your Web page. To learn how to change the 
color or background of your Web page, see “Setting the color and 
background of your Web page” on page 2-21. 


Tip To open the image in the Transparency and Interlacing Image Editor 
using the mouse, right-click (Windows) or Control-click (Macintosh) 
the image and choose Transparency and Interlacing from the pop-up menu. 


To remove transparency from an image: 


= Open the image in the Transparency and Interlacing Image Editor, 
and click the Remove Transparency button [a] on the toolbar. 


To use a transparent image to control line spacing: 


1. Make a square image that is a single color and the same color as the 
image’s background (usually white). 
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2. Set the size to be a fixed amount of pixels. 
3. Make the image transparent. 


4. Insert the image between the lines of text you want spaced according 
to the size of the image. 


Note You can also insert spacers to separate objects and text on your 
page. See “Using horizontal rules to separate text” on page 3-17, for 
more information. 


Making images interactive 


You can make images more than just visual elements on your Web 
pages. You can make them interactive so your audience can click them 
to perform an action. 


You can make an image function as: 


= A link, so viewers can click it to go to a different Web page or to an 
anchor in the same Web page. 


To make an image into a link, select the image and choose Link to File 
or Link to URL from the Insert menu. For more information, see 
chapter 7, “Creating links and anchors.” 


=» An image map, so viewers can click different parts of it to activate 
different links. 


To turn an image into an image map, select the image and open the 
Image Object Editor. Click the Behavior tab, select Image Map and 
click Edit. Draw hotspots in the image and link them to pages in the 
Image Map Editor. For more information, see “Creating an image 
map” on page 7-8. 

=» A submit button in a form, so viewers can click it to send form data 
to the server. 


To make an image into a Submit form button, select the image and 
open the Image Object Editor. Click the Behavior tab and select Form 
Submit Button. For more information, see “Using an image as a submit 
button” on page 9-18. 


Chapter 5: Adding tables to your Web page 





Inserting a table 


Tables provide a way of organizing and displaying information on your 
Web page. A table is made up of a series of rows and columns. A single 
block of information in a table is called a cell and can contain text, 
images, lists, form elements, and other tables. In fact, anything that can 
be placed in an HTML document can be placed in a table cell. You can 
make the background a different color than the rest of the page. 





Flavor Yarieties Available 





Orange [ Hazelnut 
Chocolate | Vanilla Nut 
Insh Creme [ Flavor Sample Pack 





Note Tables are a relatively new part of HTML, and not all browsers 
support them. For this reason, before you start creating tables, make sure 
you know who your audience is and what kinds of browsers they use. If 
the majority of your viewers are using browsers that don’t support 
tables, you might want to consider using preformatted text to lay out 
your information. For information on using preformatted style, see 
“Using paragraph styles” on page 3-4. 


There are two ways that Claris Home Page adds a table to your Web 
page. You can insert an empty table and then add text and images to it. 
You can also paste a copy of spreadsheet data or an exported tab- 
separated (or tab-delimited) file from a database into your Web page and 
Claris Home Page formats it into a table. 


Once you’ ve created a table, you can use the Table Object Editor to add 
more rows and columns, and to apply other attributes to the table. 


To insert an empty table: 


1. Place the insertion point where you want your table to appear on your 
Web page. 
2. Choose Table from the Insert menu. 


A table with two rows and two columns appears, and the Table Object 
Editor opens. 
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To insert a table of data from another application: 


1. Copy the data from a spreadsheet file or tab-delimited text from an 
exported database file. 


2. Place the insertion point in the Web page where you want the table 
to go. 


3. Choose Paste from the Edit menu. 


Claris Home Page inserts a table containing the copied text. 


Once you’ ve created a table, you can use the Table Object Editor to add 
more rows and columns, and to apply other attributes to the table. 


Adding elements to the table 


You add elements—text or images—to a table individually according to 
the cell you select. 


Note If you select the entire table and start typing or insert an element, 
the table is deleted. 


To enter text in a cell, click in the cell to select it and start typing. To add 
an image or other element, select the cell and choose the element from 
the Insert menu. 


As you type, the cell expands downward with all of the other cells in the 
same row of the table. The cell also expands to accommodate the height 
of an image or other element. The width of the cell, however, remains 
the same. For information on changing the width of the cell, see 
“Changing the cell width or height” on page 5-7. 


You can copy and paste text, images, and other elements from one cell 
to another in a table, from another open Web page into your table, or 
from another application into your table. 


You can also drag elements from one cell to another cell or from an open 
Web page to your table. 


To delete an element in a cell, select the element and press Backspace or 
Delete. To delete an entire row or column, including its contents, 
double-click one of the cells to open the Table Object Editor, click the 
Table tab, and click Remove Row or Remove Column. 





Using the Table Object Ed 
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itor 


Use the Table Object Editor to change the attributes of a table and the 


contents of 
your viewe 


each cell. For example, you can make the border invisible so 
rs are unaware that the information is contained in a table. 


The Table Object Editor appears automatically when you insert a table 
into your page. 


You can also open the Table Object Editor three other ways: 


= Double-click a table border or cell in a table. 


= Click a table or cell, and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu 
(Macintosh). 


= Click a table or cell, and click the Object Editor button (Bj on the 


toolbar. 


Table 





Table | Cells | FileMaker] 


Bows: [2 Add Row: Remove Row 
Columns: [2 Add Column | Remove Column 


Width: Auto x Spacing: [2 
Height: Auto = Padding: |1 
Border: [1 


able Color; ie| Table Image: _set._| | 
Remove 


Extra HTML Attributes: 











=3Table 








(Add Row] (__ Remove Row 








Columns: 


(Add Column] {_ Rernove Column 








Width: 








Auto] Spacing: [2 

















Height: 





Auto vy) Padding: |1 











Border: 











Table Color: 


Extra HTML Attributes: 








[H_] Table Image: (st) 



































Note When 


you select the table border and open the Table Object Editor, 


only the Table tab settings are displayed. To see the Cells tab settings, 


select a cell 


in the table. 
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Changing table attributes 


To change the attributes of a table, select the table and then change the 
settings in the Table Object Editor (click the Table tab if necessary). To 
apply the new settings, press Tab or click the close box of the Table 

Object Editor. See “Resizing a table or parts of a table” on page 5-6 for 


more information. 


Use this table 
attribute setting 


To do this 





Rows Specify the number of rows in the table. Rows are added to and 
subtracted from the bottom of the table. The maximum number of 
rows you can specify is 100. 

Add Row Add a row directly below the selected cell or table. 





Remove Row 


Delete the selected row or the bottom row of the selected table and 
its contents. 








Columns Specify the number of columns in the table. Columns are added to 
and subtracted from the right side of the table. The maximum number 
of columns you can specify is 25. 

Add Column Add a column directly to the right of the selected cell or table. 





Remove Column 


Delete a selected column, or the right-most column of a selected 
table, and its contents. 





Width 


Change the width of the table. Choose Percent to make the width a 
percentage of the browser window’s width. Choose Pixels to make 
the width a fixed amount that is not affected by the browser 
window’s width. Choose Auto to make the width fit evenly around 
the table elements. For more information on changing the table 
width, see “Changing the table width or height” on page 5-6. 





Height 


Change the height of the table. Choose Percent to make the height a 
percentage of the browser window’s height. Choose Pixels to make 
the height a fixed amount that is not affected by the browser 
window’s height. Choose Auto to make the height fit evenly around 
the table elements. For more information on changing the table 
height, see “Changing the table width or height” on page 5-6. 





Spacing 


Change the amount of space between cells (by making the border 
thicker). 





Padding 


Change the amount of space around the data in cells. 





Border 


Change the thickness of the table borders to make it appear beveled 
or three-dimensional. A setting of 0 makes the borders of the table 
invisible. 





Table Color 


Change the background color of a table. For more information on 
changing the color and background of a table, see “Changing the 
color and background of a table” on page 5-11. 








Use this table 
attribute setting 


Table Image 
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To do this 


Specify a background image for a table. Click Set to select an image 
file. Click Remove to restore the default background setting. 


Add other HTML attributes to a table. Requires knowledge of 


Extra HTML 
Attributes 


HTML. For more information, see “Adding extra HTML to your 
page” on page 2-16. 





Changing cell attributes 


To change the attributes of a cell, select the cell and then change the 
settings in the Table Object Editor. Click the Cells tab if necessary in the 
Table Object Editor to display the cell attribute settings. To apply the 
new settings, press Tab or click the close box of the Table Object Editor. 


Use this cell 
attribute setting 


Column Width 


Column Span 


To do this 


Change the width of all the cells in a column. For more information, 
see “Changing the table width or height” on page 5-6. 


Change how many columns a cell spans. For more information, see 


“Resizing a cell to span rows and columns” on page 5-9. 








Row Height Change the height of all the cells in a row. For more information, see 
“Resizing a row or column using the mouse” on page 5-9. 
Row Span Change how many rows a cell spans. For more information, see 


“Resizing a cell to span rows and columns” on page 5-9. 





Horizontal Align 


Change how elements are horizontally aligned within the cells. For 
more information, see “Changing the alignment of elements in a 
table” on page 5-10. 

















Line Wrap Make text wrap in a cell. 

Vertical Align Change how elements are vertically aligned within the cells. For 
more information, see “Changing the alignment of elements in a 
table” on page 5-10. 

Header Cell Format the selected cell as a table header cell in order to label a row 
or column. (Text in header cells appear in bold face type in Claris 
Home Page; they may look different in your browser.) 

Cell Color Change the background color of an individual cell. For more 
information, see “Changing the color and background of a table” on 
page 5-11. 

Row Color Change the background color of an entire row. 


Note The cell color for a specific cell will override its row color 
setting. 
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Use this cell 
attribute setting To do this 


Cell Image Specify a background image for a cell. Click Set to select an image 
file. Click Remove to restore the cell’s default background setting. 


Extra HTML Add other HTML attributes to an individual cell in a table. Requires 
Attributes knowledge of HTML. For more information, see “Adding extra 
HTML to your page” on page 2-16. 





Selecting cells in a table 


There are two ways to select cells in a table. You can select multiple 
cells in a range or at random. 


= To select a range of cells, hold down the Shift key as you click to 
select multiple table cells in a row or column. 


= To select random cells, Ctrl-click (Windows) or Command-click 
(Macintosh) the desired table cells. 


Resizing a table or parts of a table 


There are different ways you can change the size of a table and the 
table’s cells. You can use the Table Object Editor or the mouse to change 
the size of the table, individual cells, or rows and columns. 


You can set the size of a table to be a percentage of the browser window’s 
size so that the table adjusts according to what the size of the window is. 
Or you can set the size to be a fixed number of pixels so that the table is 

always the same size regardless of which browser it appears in. 


Note Some browsers that support tables do not support widths measured 
in pixels. 

Changing the table width or height 
You can change the width and height of a table and how it appears in 
different browser windows by using the Table Object Editor. You can 
also resize a table using the mouse. 
To resize a table in relation to the browser window: 
1. Double-click on the table border to open the Table Object Editor. 
2. Click the Table tab if necessary. 
3. Choose a setting type from the Width or Height pop-up menus. 
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Width: Auto il] 


F —_ |Pixels 
Height: Percent 


Pixels 


cae Percent 
Height:[ | 








Choose this type _ To have the table sized like this 


Pixels Table width or height is always the specified size, measured in 
pixels, regardless of the browser window’s size. 


Note Some browsers that support tables do not support table 
widths measured in pixels. 





Percent Table width or height appears as the specified percentage of the 
browser window width or height. 





Auto Table width or height fits evenly around its elements. 





4. Type the number of pixels or percent for the table’s width or height. 


If you leave the Width or Height boxes empty, the browser used to view 
the table will determine the table’s width or height. (In other words, 
no width or height attributes are added to the <TABLE> tag.) In 
Claris Home Page, the table is tall enough to display the text and 
images inside it and is as wide as the window. 


5. Press Tab or close the Table Object Editor to apply your changes. 


To resize a table using the mouse: 

= Select the table. 

= Drag the bottom handle to change the height of the table. 

= Drag the right-side handle to change the width of the table. 


= Drag the lower-right corner handle to change the width and height at 
the same time. 


Changing the cell width or height 


Changing the size of a cell affects the size of the table and the row or 
column that the cell is in. To change the size without affecting other 
cells, see “Resizing a cell to span rows and columns” on page 5-9. 
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To resize a cell using the Table Object Editor: 
1. Select a cell in the table and open the Table Object Editor. 
2. Click the Cells tab if necessary. 


3. Choose a setting type from the Width or Height pop-up menus. 


Column 

Width: Auto Ss 
Row 

Height: 





Choose this type To have the cell sized like this 
Pixels Column width or row height is always the specified size, 
measured in pixels, regardless of the browser window’s size. 


Note Some browsers that support tables do not support widths 
measured in pixels. 





Percent Column width or row height appears as the specified percentage 
of the browser window width or height. 





Auto Cell width or height fits evenly around its elements. 





4. Type a number in the Width text box for column’s width. 
5. Type a number in the Height text box for row height. 
6. Press Tab or close the Table Object Editor to apply your changes. 


To resize a cell using the mouse: 
= Drag the bottom border of the cell to change the height. 
= Drag the right border to change the width of the cell. 
The size of all the other cells in that row or column changes too. 
Note Dragging the handles instead of the border causes the cell to span 


columns and rows. See “Resizing a cell to span rows and columns” on 
page 5-9 for more information. 
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Resizing a row or column using the mouse 


When you change the cell width or height in a table, the row and column 
that the cell is part of resizes also. You can also resize a row or column 
using the mouse. 


Note Some browsers may ignore the size you set for the row or column. 
In addition, some browsers may override the specified size if the row or 
column size you Set is too small to display the text or images within that 
row or column. 


To resize a row or column using the mouse: 


1. Select the table. 


2. Place the pointer over the border of the row or column you want to 
resize. 


The pointer changes into a double-headed arrow. 


3. Drag the border of the row or column to resize it. 


Resizing a cell to span rows and columns 


You can resize a cell without affecting the size of other cells by making 
the cell span more than one column or row. This is useful if you want to 
make a table heading, for example. 


Important If you resize a cell to span over cells that contain text or 
graphics, the text or graphics are lost. 


To change the number of rows or columns a cell spans: 
1. Click inside the cell to select it. 


A heavy line appears on the inside of the cell. 


ae 


| 
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2. Open the Table Object Editor. 
3. Click the Cells tab if necessary. 


4. Type a number in the Span text box for rows or columns you want the 
cell to span. 


5. Press Tab or click the close box of the Table Object Editor to apply 
the changes. 


Claris Home Page gives you a warning that resizing the cell may 
cause elements in some cells to be deleted. 


Note You can select the Header Cell check box in the Table Object Editor 
to format text in the selected cell as a row or column header. 


To make a cell span more than one column or row using the mouse: 


= Drag the handle to make the cell span more than one column. The 
other cells remain unchanged. 


Changing the alignment of elements in a table 


Any element that is in a table cell can be aligned to the border of the cell 
and to other elements in a row. You can also align text and images to the 
left, right, and center of a cell. 


To align text and images to the left, right, or center of a cell: 
1. Select the element. 


2. Choose Alignment from the Format menu and then choose Align Left, 
Align Center, or Align Right. 


To align elements top, middle, or bottom of a cell: 
1. Click in the cell to select it. 


2. Choose Object Editor from the View menu (Windows) or Show Object 
Editor from the Window menu (Macintosh) or click the Object Editor 
button on the toolbar. 


3. Click the Cells tab if necessary. 
4. Choose a setting from the Vertical Align pop-up menu. 


Choose this setting To have elements aligned like this 


Top Elements are aligned at the top of the cell. 





Middle Elements are aligned in the middle of the cell. 
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Choose this setting To have elements aligned like this 


Bottom Elements are aligned at the bottom of the cell. 





Baseline Text is aligned by the baseline of each character. The baseline is 
an imaginary line that divides the main body from the descender 
of a lowercase letter, such as a “g” or “j.” This setting is 
generally used in tables where each cell contains a single line of 
text. When you are viewing your page in Claris Home Page, 
however, the text will look like it’s top-aligned. Preview the 


page in your browser to see how it will look. 





Changing the color and background of a table 


You can change the color or background image of a table or individual 
cells in the table, and make it different than the background of the rest 
of the page. 


Note Some browsers may ignore cells with no elements. Therefore, 
some cells may not display background color settings. 


For more information about setting the background of the rest of the 
page, see “Setting the color and background of your Web page” on 
page 2-21. 

To change the color of a table, individual cells, or a row of cells: 

1. Select the table or cell you wish to change. 

2. Open the Table Object Editor. 


3. Click the Table tab if you’re changing the color of a table or the Cells 
tab if you’re changing the color of individual cells. 


4. Place the pointer over the Table Color, Cell Color, or Row Color box and 
hold the mouse button down until the pop-up color palette appears. 


Note You can change the default color palette that appears. For 
information on how to do this, see “Changing the default color palette 
display” on page 2-23. 

5. Select the color you want for the table or table cell. 


A color set for an individual cell overrides the row or table colors. 


To change the background image of a table or individual cell: 
1. Select the table or cell you wish to change. 
2. Open the Table Object Editor. 
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3. Click the Table tab if you’re changing the background of a table or the 
Cells tab if you’re changing the background of an individual cell. 


4. Click the Table Image Set or Cell Image Set button. 
5. In the Open dialog box, select the image file and click Open. 


Chapter 6: Using Claris Home Page libraries 





You can use a Claris Home Page library to store Web page elements and 
copy them onto new pages. For example, you can store logos, navigation 
buttons, boilerplate text, clip art, tables, form elements, and pieces of 
HTML code. A library lets you organize the elements in groups by entry 
name so they’re easy to find and copy onto your pages. 


The library window is like a card catalog: The left section of the window 
lists the entries and the right section displays the contents (the Web page 
elements) of each entry. You can copy individual elements from the 
right section or you can copy a whole group of elements by dragging the 
entry name from the left section of the library window onto your page. 
When you add an element to the library, you can either add it to an 
existing entry or make a new entry for it. 


To get you started, Claris Home Page provides library files that contain 
clip art, animations, images, applets, movies, and styles ready for you to 
use. You can use these libraries or your Web pages to create your own 
custom libraries. 


When you copy Web page elements that reference other files (such as 
GIF image files, movie files, or applets) from one of these libraries onto 
your page, you need to save a copy of the referenced files for your site 
as well. When you create a new library and add these kinds of elements 
to it, you also need to add a copy of the referenced files to the folder that 
the library file is in. You can use Claris Home Page to do this. See 
“Consolidating media files” on page 12-4. 


Opening a Claris Home Page library 


To open a library: 


1. Choose Library from the File menu and then choose Open or a library 
name from the submenu. 


Library names appear in this submenu of all library files that reside in 
the Contents folder inside the Claris Home Page folder. Library files 
have the .hlb extension. 


2. If you chose Open, navigate to the folder where the library file resides 
and click Open. 
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The library window appears and a new Library menu appears on the 
menu bar. 








Note The GIF image files and other referenced files that are provided 
with a Claris Home Page library are stored in the same folder as the 
library file (in the Contents folder). When you copy an image from one 
of these libraries onto your Web page, the reference is made to the image 
file located in that folder. When you want to upload all the files in your 
site to the Web server, you'll need to have all the referenced image files 
located in your site folder. An easy way to copy them into your site 
folder is to use the consolidate images feature. For more information, 
see “Consolidating media files” on page 12-4. 





Using a library 
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Libraries are useful for keeping common Web page elements organized 
in one file and copying them onto new Web pages in your site. 


The two new pop-up buttons on the Library toolbar are a way to insert 
library elements into your Web page. 


To insert a library element into your page: 


1. 


Open the pages you want to insert library elements into and open the 
library. 


. Select the element in the right-hand section of the library window. 


. Place the pointer over the Insert in Page button |[EJ$] on the Library 


toolbar, hold the mouse button down until you see the pop-up menu, 
and then choose a page. 


The library element is inserted at the insertion point in the page. 


To insert a library element into the background: 


1. 


Open the page you want to insert a library background image into and 
open the library. 


. Select the element in the right section of the library window. 


. Place the pointer over the Use As Page Background button on the 


Library toolbar, hold the mouse button down until you see the pop-up 
menu, and then choose the page. 


The Library element is inserted into the background of the page. 


You can hide the background in Edit Page mode if you want. To hide a 
background image: 


1. 


Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 


. Click the Images tab to display a new set of options. 
. Deselect the Display background images in Edit Page mode check box. 
. Click OK. 


The background is hidden in Edit Page mode but still appears in 
Preview Page mode and in the browser. 
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Creating a library 


To copy library elements using the mouse: 
1. Open the pages you want to copy elements into and open the library. 


2. Position the library window on your screen so you can see the 
library’s contents and your Web page. 


3. Drag elements from the library to copy them onto your pages. 


To copy Do this 


One element Select the element in the right section of the library 
window and drag it onto your page. 





All of the elements in anentry _ Select the library entry in the left section of the library 
window and drag it onto your page. All the elements 
displayed in the right section of the library for the 
selected entry are copied onto your page. 





You can create a library to contain references to GIF files and any 
elements that you can place in an HTML file. When you add Web page 
elements to a library that reference other files, you should also add the 
referenced files to the same folder that the library file is in. 


To create a library: 
1. Choose Library from the File menu and then choose New. 
An untitled library window appears. 


Pet | 


This is an entry of a 
Library file into which a 
you can insert clip-art 

or boilerplate text to 

be used in your 
documents. To add 

text or images to the 
entry, drag them to 

this area of the 

window. 


To insert text or 
images into a page, 
drag them from this 
area. If you click on 
an entry at the left 
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untitled 


SS!" 
[el[e1s) [2] 


a This is an entry of a 
Library file into which 
you can insert clip-art or 
boilerplate text to be 
used in your documents. 
To add text or images to 
the entry, drag them to 
this area of the window. 


To insert text or images 
into a page, drag them 
from this area. If you 
click on an entry at the 
left side, its contents will 
appear in this area. 











The untitled library window displays an untitled entry on the left 
section and information about library files on the right section. 


2. Add elements to the library. (See “Adding entries to a library” next.) 
3. Choose Save from the File menu. 


4. In the dialog box that appears, type a name for your library and 
choose the location for the file. 


Note To save a library so that it appears in the File menu in the 
Library submenu, save the file in the Contents folder inside the Claris 
Home Page folder. 


5. Click Save. 


Claris Home Page saves your library with the file extension .h1b. 


Adding entries to a library 


When you add Web page elements to a library, they’re stored in entries. 
You can organize your library elements in groups. For example, in a 
background library, your entries might be paper textures, floral textures, 
and so on. When you select the paper texture entry on the left section of 
the library window, the different paper texture elements appear on the 
right section. 
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There are several ways you can add an element to a library—you can 
make a new entry and copy elements into it, you can copy elements from 
other libraries, you can drag them from your Web page, and you can 
drag files from your desktop into an open library. 


To make a new entry: 


1. Choose New Entry from the Library menu or click the New Entry button 
(6) on the toolbar. 


An untitled entry appears on the left section of the library window. 
2. Select the entry name “untitled” and type a name for the new entry. 


3. Add elements to the entry by pasting or dragging them from your 
page into the right section of the library window. 


4. Choose Save from the File menu. 


To add entries from other libraries: 
1. Open both libraries and arrange them side by side. 


2. Choose New Entry from the Library menu or click the New Entry button 
[6] on the toolbar. 


An untitled entry appears on the left section of the library window. 
3. Select the entry name “untitled” and type a name for the new entry. 


4. Drag each entry from the original library to the right section in the 
new library window. 


To delete elements from the entry, select them in the right section of 
the library window and press Delete. 


5. Choose Save from the File menu. 


Editing library entries 


The contents of a library can be organized in different ways. You can 
change the order of entries in the list, rename an entry to include 
subcategories and, delete entries in the library window. 


Changing the order of entries in the list 


You can change the order of entries in the list by dragging their icons to 
new positions in the left section of the library window. 
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Renaming an entry 
To rename an entry: 


1. Double-click the entry name in the left section of the library window. 


O) Style: Southwest 


moChOo. 





© Style: Wi 


2. Type a new name for the library entry. 


3. Choose Save from the File menu. 


Deleting an entry 
To delete an entry: 


1. Click on the entry’s icon in the left section of the library window. 
Sle: School 


2. Choose Clear from the Edit menu or press Delete. 
3. Choose Save from the File menu. 


Editing text elements in the library window 


You can edit text elements of an entry by using the same tools and 
methods you use to edit text on your Web page. Select the text you want 
to edit and choose an option. For example, if you want to change a text 
style to bold, select the text and choose Bold from the Style menu. You 
can also cut, copy, and paste text from another library. See chapter 3, 
“Adding text to your Web page.” 


Chapter 7: Creating links and anchors 





You can include hypertext links in your Web pages to allow your 
audience to move easily from one page to another within your site, or to 
other locations and resources on the World Wide Web. 


Claris Home Page makes it easy for you to create links from your Web 
page to other: 


= pages in your site 
= places in the same page 


= sites on the Web 


You can also create special kinds of links to pages so they appear in 
frames, and links to databases so they appear in forms (see chapter 8 
“Adding frames to your Web page” and chapter 9 “Adding forms to your 
Web page” for more information). 


You can make text, images, or specific parts of an image (called an 
image map) into hypertext links that connect to pages, anchors in a page, 
and other Internet-accessible resources, such as email addresses. 


Every page or resource on the World Wide Web needs to have an address 
so that you can link to it. This address is referred to as a URL, or Uniform 
Resource Locator. When you create links to other Web sites or to Internet 
resources , you must specify the exact URL of the destination. However, 
when you create a link to another page or anchor within a page in your 
Web site, Claris Home Page automatically inserts the required URL. 


It’s best to have the contents of your Web pages in place before you 
begin creating links. Making a flow chart of your pages can help you 
keep track of where you want to add links and where those links should 
lead. (For more information, see “Outlining the structure of the site” on 
page 1-2.) 


Linking to pages within your Web site 


Any text element or graphic image on your page can be a hypertext link 
to another page in your Web site. When you set up text or an image to 

be a hypertext link, you choose the page you want to link to, and Claris 
Home Page automatically inserts the destination URL for that link. 
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You can also link parts of an image to other pages in your Web site by 
creating an image map. See “Creating an image map” on page 7-8. 


Creating a link to a Web page 
When you create a link, you select text or an image and specify a 
destination URL for it. By default, a link you create in a page takes you 
to the top of the page you’ re linking to. To make a link go to a different 
place in the page, you need to create an anchor. See “Linking to an 
anchor in your page” on page 7-3. 
To create a link to a Web page in your site: 
1. Select the text or image you want to make into a link. 


2. Choose Link to File from the Insert menu or click the Link Editor button 
on the toolbar. 


3. Select the name of the Web page you want to link to and click Open. 


The text becomes underlined and the color of the text or the image 
border changes to indicate the link. 


To remove the visible border from an image link, select the image, 
choose Object Editor from the View menu (Windows) or Show Object 
Editor from the Window menu (Macintosh), and type 0 in the Border 
text box. 


For information about changing the default color of links, see 
“Changing the color of links” on page 7-14. 


4. Save your Web page. 


To create another link to the same location or a recently used URL: 
1. Select the new text or image you want to make into a link. 


2. Choose Link Editor from the View menu (Windows) or Show Link Editor 
from the Window menu (Macintosh). 


3. Choose the most recent URL listed at the top of the URL pop-up menu. 
You can also click the Browse Files button to locate a file. 





[= Link 
URL: [x] 




















(__Browse Files... ] (Remove Link | [_ Show Examples 




















Use the pop-up menu to see 
the most recently used URLs. 
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For information about testing links, see “Testing the links” on 
page 7-12. 


Setting a Base Document URL: You can specify a Base Document 
URL for the links on a page in your site. This feature can be used for 
complex Web sites that comprise many folders so that the links are 
associated with a single document or folder. If your Web site is a single 
folder, this feature is not necessary. 


Note Some older browsers do not support the HTML element used to 
create the Base Document URL for a page. 


Setting a Base Document URL for the links in a page is generally done 
before links are created for that page, because it affects all the links you 
create for that page. 


To set the Base Document URL for a page in your site: 


1. Choose Document Options form the Tools menu (Windows) or 
Document Options from the Edit menu (Macintosh). 


2. Click the Parameters tab, if necessary 


3. Type the complete pathname for the page in your site that will serve 
as the Base Document URL in the Base Document URL text box. For 
example: 


http: //domain_name.com/folderB/subfolderB/index.htm 
4. Click OK to apply your setting. 


Linking to an anchor in your page 


When you create a link to a page, the link goes to an anchor at the top of 
the page. You can create your own anchors and place them anywhere you 
want in the page. When someone clicks on a hypertext link to an anchor, 
the browser displays the part of the page that contains the anchor. 


You can create links that jump to anchors on the same page that contains 
the link or that jump to anchors on other pages in your Web site. 


Creating an anchor 
To create an anchor in your page: 


1. Position the insertion point where you want to place the anchor in 
your Web page. 
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2. Choose Anchor from the Insert menu, or click the Insert Anchor button 
|£| on the toolbar. 


A dialog box appears with a default name for the anchor. 


fet Anchor Name | 


Please name this Anchor: 


fm 





coe 








Anchor Name 


Please name this Anchor: 








3. Type a new name for the anchor. 

You'll refer to this name when you create a link to the anchor. 
4. Click OK. 

An anchor icon 4 appears on your Web page. 


5. Save your Web page. 


Creating a link to the anchor 


After you’ ve created and named the anchor in your page, you can create 
a link to it. 


To create a link to an anchor: 
1. Open the Web page that contains the anchor you want to link to. 
2. Select the text or image you want to make into a link to the anchor. 


3. Choose Link to URL from the Insert menu, or click the Link Editor 
button on the toolbar. 


The Link Editor opens. 


4. In the URL pop-up menu, choose the open page that contains the 
anchor, and then choose the anchor name from the submenu. 
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5. Close the Link Editor and save the page. 


The selected text or image becomes underlined and the color of the 
text or the image border changes to indicate the link. 


To remove the visible border from a linked image: 


1. Select the image, and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu 
(Macintosh). 


2. Type 0 in the Border text box. 
3. Close the Image Object Editor. 


For information about changing the default color of links, see “Changing 
the color of links” on page 7-14. 


You can test the link in Preview Page mode or Preview in Browser 
mode. For more information, see “Testing the links” on page 7-12. 


Tip You can create a link to the anchor by dragging the anchor from one 
page to another. When you drag the anchor from one page to another, 
the anchor remains in its original location and a text link to the anchor is 
inserted in the new location. To create a link in the same page as the 
anchor, hold down the Control key (Windows) or Option key 
(Macintosh), and then drag the anchor to the location where you want to 
insert the link. By default, the text of the link is #anchorname where 
anchorname is the name of the anchor. 
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Changing the anchor's attributes 
You can change the name of an anchor at any time or add extra HTML 
to it. Note, however, that any links you’ve made to the anchor must be 
re-created using the new name you assign. 
To rename an anchor: 
1. Double-click the anchor icon in your Web page. 


The Anchor Object Editor appears. 


Meare | Esters | 
Mores 
Rare nen hes ree SUL. of 9'8'( 
"Tata" vypagebpat bx an ancter rarest ba drt 
hewn 


Enter the new name 
for the anchor 





2. Type a new name for the anchor in the Name text box. 


3. Close the Anchor Object Editor to apply the changes. 


To add HTML to an anchor element: 

1. In the Anchor Editor, click the Both tab. 

2. Type the HTML in the Extra HTML text box. 

3. Close the Anchor Object Editor to apply the changes. 


Linking to extemal Web pages and resources 


To link to a Web page or other Internet-accessible resources outside of 
your Web site, you must know the exact URL for that Web page or 
resource and you must use the correct syntax when you type it into the 
Link Editor. 


To create a link to an external site: 


1. Select the text or image you want to make into a link. 
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2. Choose Link to URL from the Insert menu or click the Link Editor button 
on the toolbar. 




















The Link Editor appears. 
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3. Type the URL of the link’s destination in the URL text box. 


You can see some examples of the correct syntax for URLs by 
clicking Show Examples. 











To link to Use this syntax 

A Web page within your Web site file.html 

A Web page outside your Web site http://servername/dir/file.html 
An anchor on the same Web page #anchorname 

An anchor on a page within your Web site file.html#anchorname 





An anchor on a page outside your Web site http://.../file.html#anchorname 





An FTP site ftp://servername/dir/file.txt 





An email address mailto:username @ hostname 





Note An example of an Internet-accessible resource is an email 
address. You can use mailto links to send an electronic message to a 
specific email address. When mailto links are clicked, the browser 
opens an email message window where you can type and send a 
message addressed to that email address. 


4. Close the Link Editor. 


The selected text or image changes to indicate the link. 


To remove the visible border from a linked image: 
1. Select the image. 


2. Choose Object Editor from the View menu (Windows) or Show Object 
Editor from the Window menu (Macintosh). 
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3. Type 0 in the Border text box in the Image Object Editor. 


For information about changing the default color of links, see “Changing 
the color of links” on page 7-14. 


To create another link to the same location, select the new text or image 
you want to make into a link and choose the most recent URL listed at 
the top of the URL pop-up menu. 


You can test your links to external pages and resources by using the 
Preview in Browser mode. For more information, see “Previewing and 
testing your site” on page 1-10. 


Creating an image map 


You can divide an image into multiple parts and link the parts (called 
hotspots) to different pages in your Web site. When you create an image 
map, you link different parts of the image to separate destinations. 


You can create client-side image maps and server-side image maps. 
Client-side image maps are easy to implement, because they eliminate 
the need for a CGI script, which is required by server-side image maps, 
and they may perform faster because of the reduced demand on the 
server processor. However, some older browsers such as Mosaic and 
earlier versions of Internet Explorer and Netscape Navigator do not 
support the client-side image map. 


If you want to accommodate people who have newer browsers and those 
who have older browsers, you might consider creating both a client-side 
and a server-side version of each image map on your Web site. You also 
might consider using several individual images as links instead of an 
image map. 


To create either kind of image map, you need to assign hotspots to the 


image. Hotspots are hypertext areas on an image map that people can 
click to jump to different URLs. 


Circular hotspot 


Rectangular hotspot 
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Creating a client-side image map 
When you create a client-side image map, you draw hotspots over parts 
of the image and link them to pages or URLs. You can make the areas 
of an image that aren’t covered by hotspots link to a default URL. When 
someone clicks on the image map but doesn’t click on a particular 
hotspot, the default link is activated. 


To create a client-side image map: 


1. 


Select the image and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu 
(Macintosh). 


. Click the Behavior tab, if necessary. 
. Click the Image Map radio button, and then click the Edit button. 


The image file opens in the Image Map Editor. 


. Use the Zoom pop-up menu to increase the magnification of the 


image. 


. Select the Rectangular Link (&J or the Circular Link [J tool on the toolbar 


and draw a rectangle or circle over the area of the image that you want 
to be a hotspot. 


When you are finished creating the hotspot, the Link Editor appears. 


. Type the filename or URL of the link destination in the URL text box 


or choose it from the URL pop-up menu. 

















URL filename shown 
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Type the URL link destination 


7. Repeat steps 5 and 6 to create other hotspots in the image. 


Claris Home Page consecutively numbers each hotspot as you draw 
it, with smaller-numbered hotspots in front. 


Note If you draw hotspots that overlap each other, hotspots in front 
take precedence over the ones in back. Use the Move Link buttons to 
change the order that layered hotspots are used. 


8. For areas that aren’t covered by a hotspot, type a URL in the Default 
URL text box or choose it from the Default URL pop-up menu 


9. Close the Link Editor and the Image Map Editor. 


To remove all hotspots and destination URLs from an image map: 
1. Select the image. 


2. Choose Object Editor from the View menu (Windows) or Show Object 
Editor from the Window menu (Macintosh). 


3. Click Clear. 


Creating a server-side image map 
It is useful to provide server-side image maps for members of your Web 
audience who may have old browsers. Making a server-side image map 
work requires an available CGI image map program or equivalent 
software supported by your Web server. You must also choose what 
type of server-side image map is supported by your Web server or 
Internet service provider, NCSA or CERN. 


To set the type of server-side image maps you create: 


1. Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh). 





2 
3 
4 


Creating links and anchors 7-11 


. Choose the Images tab, if necessary. 
. Set the Image Map Format option to NCSA or CERN. 
. Click OK. 


To create a server-side image map: 


1 


3 


6 


. Select the image and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu (Macintosh). 


. Click the Behavior tab, if necessary. 

. Click the Image Map radio button, and then click the Edit button.. 
The image file opens in the Image Map Editor. 

. Click the Create Server Side Image Map check box. 


. Use the Zoom pop-up menu to increase the magnification of 
the image. 


. Select the Rectangular Link (J and the Circular Link (J tools to draw 
hotspots in the image. 


The Link Editor appears for every hotspot you draw. 


. In the Link Editor, Type the filename or URL for each hotspot link 
destination in the URL text box. 


To specify a default URL for the image map, type the URL in the 
Default URL text box or choose the URL from the pop-up menu next 
to the Default URL text box. 


Claris Home Page consecutively numbers each hotspot as you draw 
it, with smaller-numbered hotspots in front. 


Note If you draw hotspots that overlap each other, hotspots in front 
take precedence over the ones in back. Use the Move Link buttons to 
change the order that layered hotspots are used. 


. Save your image map file by choosing Save from the File menu, and 
then close the Image Map Object Editor. 


The image map file is named the same as the image file except that 
the extension is .map instead of .jpg or .gif. This map file is created 
in the same folder as the image file. 


. With the image still selected in your page, choose Link to URL from the 
Insert menu or click the Link Editor button [BJ on the toolbar. 


The Link Editor appears. 


10. For most ISPs, you will need to type the pathname of the image- 


handling script and map file name in the URL text box. 
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Testing the links 


Depending on your ISP, you may type something like this for a CGI 
called “imagemap” and an image file called “picture.gif,” which 
would have a map file called, “picture.map”: 


/cgi-bin/imagemap/~myfiles/images/picture.map 
Note Check with your ISP for the format of this link. 


11.Close the Link Editor. 
12.Save your Web page. 


Important Talk to your Web server administrator or Internet service 
provider to get the Web server requirements for using a server-side 
image map. Some Web server software may have built-in image map 
support, and not require an additional CGI, though they still may require 
either a NCSA or CERN image map format. Other servers may require 
a special file name extension for the map file other than the .map 
extension that Claris Home Page creates. 


For more information on server-side image map issues, see http:// 
www.claris.com/support/products/clarispage/. 


To remove all hotspots and destination URLs from an image, select the 
image, open the Image Map Object Editor, and click Clear. 


You can test the image map links in Preview Page mode. For more 
information, see “Testing the links” on page 7-12. 


You can test a link to a page or an anchor in your Web site using Preview 
Page mode or a context menu in Edit Page mode. Links to other Web 
sites or Internet-accessible resources must be tested in a Web browser. 


You can also use the Site Editor to make sure all the links are correct 
before you upload your site to the Web. See “Verifying links and 
references” on page 12-6. 


Before you test the links, make sure you save all of your Web pages that 
contain the links or are the target of links. 


To test a link in Preview Page mode: 


1. Choose Preview Page from the View menu (Windows) or the Window 
menu (Macintosh) or click the Preview Page button |] on the toolbar. 
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2. Move the pointer over the link until it turns into a hand * . 
3. Click the link. 


Claris Home Page displays the linked page. If the link is connected to 
an anchor on the page, then the part of the page that contains the 
anchor appears at the top of the window. 


To test a link using a context menu in Edit Page mode, right-click 
(Windows) or Control-click (Macintosh) the link and choose Follow Link 
from the pop-up menu. 


For information about other keyboard and mouse shortcuts you can use 
in Claris Home Page, see appendix B “Shortcuts for using Claris Home 
Page.” 


To test a link to an external Web site or Internet-accessible resource: 


1. Click the Preview in Browser button, and choose a browser from 
the pop-up menu. 
Claris Home Page starts the default browser application and opens 
the page in it. 

2. Move the pointer over the link until it becomes a hand * and click 
the link. 


See “Previewing your work” on page 2-12 for more information. 


Copying links and anchors 


You can copy and paste links or anchors between pages of your Web site 
rather than re-creating them multiple times. Simply select the link or 
anchor and copy and paste as you would normally, or you can drag it 
from one page to another. To copy a link or an anchor to a location in 
the same page, hold down the Alt key (Windows) or Option key 
(Macintosh) while you drag it. Claris Home Page copies the entire link, 
including the link’s address. 


You can also store links and anchors in a library and copy them from 
there into your Web page. See chapter 6, “Using Claris Home Page 
libraries” for more information. 


For more information about copying elements, see “Cutting, copying, 
and pasting” on page 2-7. 
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Deleting links 
To delete a hypertext link but not the text or image associated with 
the link: 
1. Select the link. 


2. Choose Link Editor from the View menu (Windows) or Show Link Editor 
from the Window menu (Macintosh). 


3. Click Remove Link. 


To delete the text or image in addition to the link itself, select the link 
and press Delete. 


Changing the color of links 


You can change the default color of links in your Web page. The color 
of the link can change to show whether it has been clicked or not. 


Note Not all browsers display the colors that you select, so you'll 
probably want to view your Web pages in your browser to check your 
new color scheme. 


To change the color of links: 


1. Choose Document Options form the Tools menu (Windows) or 
Document Options from the Edit menu (Macintosh). 


2. Click the Appearance tab, if necessary. 


Text Color 
Text: o| 
Normal Link: gg. 
Visited Link: fi, 
Active Link: J, 


Restore Default Colors 


Text Color 
Text: [a] 
Normal Link: [Iii] 


Visited Link: f 
Active Link: [Ii] 


Restore Default Colors 
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3. Choose a color from the Text Color pop-up menus for the type of link 
you want to change. 


Choose a color from 





this pop-up menu To change the color of Default color 
Normal Link Links that the viewer has never clicked _—_ Blue 

Visited Link Links the viewer has already clicked Purple 

Active Link Links while they are being clicked Red 





Note You can change the default color palette that appears in these 
pop-up menus. See “Changing the default color palette display” on 
page 2-23. 

4. Select the color you want for that type of link. 

5. Click OK. 

6. Repeat steps 3 through 5 for each link color you want to change. 


7. Save your page. 


Changing the color of links affects only the document you’re working 
on. To change the color of links of all pages in your site at once, you can 
do so in the Site Editor. See “Using the Site Editor’ on page 2-27. 


Chapter 8: Adding frames to your Web page 





Web browsers usually display a single Web page. It is possible to have 
a browser display more than one Web page at a time. You do this by 
creating a special kind of frame layout document that is divided into 
rectangular sections called frames. When you’re editing frames in the 
page, you cannot add text, images, links, or other elements to them. 
Frames are simply containers, placeholders that you use to display Web 


pages. 


A page that uses frames (also known as the root frameset) can show your 
audience the entire scope of your site in one window and make it easy to 
navigate through the pages. You can place as many frames in a page as 
you like and you can resize the frames and change their orientation. You 
can place a Web page that contains links in one navigational frame and 
have the links open different Web pages in another frame. 


Note Before you decide to use frames, be aware that they are a new 
feature of the Netscape extensions to HTML 3.0 and aren’t supported 
by many Web browsers. 


Claris Home Page automatically adds an explanatory message to pages 
that use frames for people who use Web browsers that don’t support 
frames. You should customize this message by changing it in Edit 
Page mode and insert a link to a non-frame version of your Web page if 
you want. 


ZAP S easy oo 
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Creating a page that uses frames 


There are two ways to create a page that uses frames in Claris Home 
Page. You can create a page using the Frame Assistant. The assistant 
helps you set up your frame layout, create a navigational menu (like a 
table of contents) and assign existing files to your frames. For more 
information on using the Frame Assistant, see “Using site assistants” on 
page 2-4. 


You can also create a page that uses frames without the use of the Frame 
Assistant. To create a page that uses a navigational menu, see “Creating 
a navigational frame layout” on page 8-11. 

To create a page that uses frames: 

1. Open all the Web pages you want displayed in the frames. 

2. Choose New from the File menu. 


The New dialog box appears. 





Empty Site 
Frame Page 











Adding frames to your Web page 8-3 

















CLARIS 


© Create New... 
O Use Assistant 
© Use Template 


Blank Page 
Empty Site 
Frame Page 





The creates 4 normal, empty page. 








3. If you want to create a page that uses frames yourself, click Create 
New, select Frame Page in the list, and click OK. 


If you want to use an assistant to create the page, click Use Assistant, 
select Frame Assistant in the scrolling list, and click OK. Skip the rest 
of these steps and follow the instructions in the Frame Assistant. 


4. Select the pages that you want to display in frames by clicking the 
check boxes next to each page in the dialog box. 


Ciena) x] 
Select files for inclusion in the new Fame Document: 





© C:\Web Pages\primary. htm = 
© C:\Web Pages\Chp318.htm 














Add File... Dostiment Biientation: [Horizontal |] 


OK Cancel 














If the pages you want displayed in the frames are not open, click Add 
File, select the page, and then click Open. Once selected, the Web page 
appears in the list with a selected check box next to it. 

If you don’t select any pages, Claris Home Page creates a page with 
two blank frames. 


5. Choose Horizontal or Vertical from the Document Orientation pop-up 
menu to set the orientation of the frames. 


6. Click OK. 


An untitled page containing frames opens displaying the Web page in 
the orientation you specified. 
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Important Claris Home Page automatically displays pages that uses 
frames in Edit Frames mode. This is an additional mode available 
only when you are working with frames. When a page that uses 
frames is open and selected, the Frame menu appears on the menu 
bar, the Edit Frames button [IB] is selected, and the Subdivide Horizontally 
[EX Subdivide Vertically LJ, Add Frame [ES], Select Parent Frameset [i], and 
Select Root Frameset [Gi] buttons appear on the toolbar. 




















Modifying the frame explanatory message 


When a page that uses frames is viewed with a browser that does not 
support frames, a message appears instead of the page. You can 
customize this message. 


To make changes to the alternative message: 


1. Switch to Edit Page mode by clicking the Edit Page button [4 on the 
toolbar. 


2. Select the sample text that appears by default and type a new 
message. 


You can add formatting styles to the text, insert images and make 
links to other pages in this message. 


3. Switch back to Edit Frames mode by clicking the Edit Frames button 
on the toolbar. 


Adding frames to your page 


When you first create a page that uses frames, Claris Home Page lets you 
select the pages you want to display in the frames and automatically 
creates a horizontal or vertical frame for each page you specify. You can 
add frames to the page at any time, and divide existing frames into more 
horizontal or vertical frames. 


Tip You can rearrange the position of frames on the page by using the 
mouse. Simply drag the frame you want to move to its new location 
within the page. 

To add a new frame: 


1. Select a frame in the page and choose Add Frame from the 
Frame menu. 


An open dialog box appears so you can choose a Web page for the frame. 
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2. Select the page you want displayed in the new frame. 
3. Click Open. 


If the frame you selected is a horizontal frame, a new horizontal 
frame is added above it. If the frame you selected is a vertical frame, 
a new vertical frame is added to the right of it. See “Using the frame 
object editors” on page 8-6 for information about changing the 
orientation of horizontal or vertical frames. 


If you want to add a frame without specifying a Web page to display in 
the frame, choose Add Blank Frame from the Frame menu. 


To delete a frame, select the frame and press Backspace (Windows) or 
Delete (Macintosh). 


Creating frames within frames 


If you want to have horizontal frames and vertical frames in the same 
page, you need to create frames within a frame. Frames that are grouped 
together are enclosed by their own border. This type of border is called 
a parent frameset. The border that encloses the entire grouping of frames 
on the page is called a root frameset. 


To create frames within a frame: 
1. Select the frame. 
2. Divide the frame into two frames: 
= To divide a frame into two horizontal frames, choose Subdivide 
Horizontally from the Frame menu or click the Subdivide Horizontally 
button [E] on the toolbar. The single frame is divided into two 
horizontal frames. 
= To divide a frame into two vertical frames, choose Subdivide 


Vertically from the Frame menu or click the Subdivide Vertically 
button (J. The single frame is divided into two vertical frames. 


Note You can change the vertical and horizontal orientations of all the 
frames in the root frameset or a parent frameset. See “Changing the 
orientation of frames” on page 8-10 for more information. 
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Using the frame object editors 


You can change the attributes of a frame using two frame object editors. 
You use the Frame Object Editor to assign Web pages to the frames in 
your page and to change the appearance of the frames (such as their 
size). You use the Frame List Object Editor to change the direction of 
the frames within a frameset. You can have several framesets in a page. 


You can also use the Frame Object Editor to name the frames and to 
open any Web pages you need to make additional edits to. Naming 
frames is necessary when you want to create one stationary frame for 
holding a table of contents or navigational buttons and another dynamic 
frame for displaying alternating pages. For more information, see 
“Creating a navigational frame layout’ on page 8-11. 


Using the Frame Object Editor 
To open the Frame Object Editor, do one of the following: 
= Double-click a frame. 


= Click a frame, and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu (Macintosh). 


= Click a frame, and click the Object Editor button [Bj] on the toolbar. 














T o=3Frame. 
Page Displayed in Frame 
Pate:[ 


Frame Name: [CU 








To apply the changes you make to a frame, press Tab or close the Frame 
Object Editor. 
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Using the Frame List Object Editor 


You can change the orientation of a group of frames within a frameset 
or all the frames on your page. 


To change a group of frames within a frameset, select a frame within the 
frameset and choose Select Parent Frameset from the Frame menu or click 
the Select Parent Frameset button [fj]. 


To change all the frames in your page, choose Select Root Frameset from 
the Frame menu or click the Select Root Frameset button [G]. 


To open the Frame List Object Editor, select a parent or root frameset 
and do one of the following: 


= Choose Object Editor from the View menu (Windows) or Show Object 
Editor from the Window menu (Macintosh). 


= Click the Object Editor button [B] on the toolbar. 


[Horizontal 


[Pd Show Border Border Size: [i | 
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Assigning Web pages to your frames 


All frames in the page need to have a Web page assigned to them. Claris 
Home Page prompts you to assign pages when you first create a page 
that uses frames and when you add frames to the page. In addition, 
you can: 


= use the Frame Object Editor to assign a page to a selected frame 


= drag the file icon of a Web page or an anchor icon from an open Web 
page onto a frame 


To assign a page to a frame using the Frame Object Editor: 
1. Select the frame and open the Frame Object Editor. 
2. Click the Content tab, if necessary. 


3. Specify the filename of the Web page you want to appear in the frame 
in the Page Displayed in Frame text box. 


You can either type the URL to the filename in the text box, choose 
the URL from the pop-up menu of open or recently opened files, or 
click the Assign File button to choose the file. 


4. Press Tab to apply the new setting. 
The Web page appears in the frame. 


5. Select each of the other frames in your document and repeat these 
steps to assign Web pages to them. 


6. Close the Frame Object Editor. 
7. Save the page. 
Important Be sure to assign Web pages to all of the frames in your 


document. If a frame is not assigned a Web page, the viewer’s browser 
may place a defaulted message. 
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Changing the appearance of a frame 


You can use the Frame Object Editor to change the size of frames and to 
specify whether to display a border or scrolling bars on them. 


To change the appearance of a frame, select the frame, open the Frame 
Object Editor, and click the Appearance tab. To apply the new settings in 
the object editor, press Tab or close the object editor. 


Use this frame 
attribute setting 


Size 


To do this 


Change the size of a frame. 


Choose Percent to make the size a percentage of the browser 
window’s size. 


Choose Pixels to make the size a fixed amount that is not affected by 
the browser window’s size. 


Choose Stars to make the size of a frame use the remaining space in 
the page. This setting acts like a wildcard to match the remaining 
space with the settings of the other frames. For example, if you have 
two frames in the page, and you set the first frame to 40 percent and 
the second frame to Stars, the second frame uses the remaining 60 
percent of the document. If more than one frame in a document has 
the Stars setting selected, the remaining space is divided up between 
them proportionately based on the value in the Size text box. 





Fixed Size 


Select if you don’t want the viewer to be able to resize the frame. 
Leave unselected if you want the viewer to be able to resize the 
frame. 





Margin Width 


Specify how far you want the Web page displayed in the frame 
indented from the sides of the frame. You can specify any amount 
from 0-100 pixels. 





Margin Height 


Specify how far you want the Web page displayed in the frame 
indented from the top and bottom of the frame. You can specify any 
amount from 0-100 pixels. 





Scrollbars 


Specify whether the frame has a scrollbar or not. 


Choose Always if you want the frame to have a scrollbar, Never if you 
don’t want the frame to have a scrollbar, or Auto if you want the frame 
to have a scrollbar when the Web page displayed in the frame is 
larger than the frame itself. 


Note It’s a good idea to test how these scrollbars appear in different 
browsers. For more information, see “Testing with different Web 
browsers” on page 1-11. 





Show Border 


Specify whether the frame has a border or not. 





Tip Youcan also resize frames using the mouse. Place the pointer over the 
border of the frame or frameset until it changes into a double-headed 
arrow. Then drag the border to its new position. 
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Changing the appearance of a frameset 


You can use the Frame List Object Editor to change the size and 
orientation of all the frames in a frameset and to specify whether to 
display a border around it. 


To change the appearance of a frameset, select the frameset border, open 
the Frame List Object Editor, and click the Appearance tab. To apply the 
new settings in the object editor, press Tab or close the object editor. 


Use this frame 
attribute setting To do this 


Size Change the size of a frameset. 


Choose Percent to make the size a percentage of the browser 
window’s size. 


Choose Pixels to make the size a fixed amount that is not affected by 
the browser window’s size. 


Choose Stars to make the size of the frameset use the remaining space 
in the page. This setting acts like a wildcard to match the remaining 
space with the settings of the other frames. For example, if you have 
other frames in the page, and you set the frameset to 40 percent and 
the other frames to Stars, the other frames uses the remaining 60 
percent of the document. If more than one frame in a document has 
the Stars setting selected, the remaining space is divided up between 
them proportionately based on the value in the Size text box. 


Show Border Specify whether the frameset has a border or not. 





Tip You can also resize a group of frames using the mouse. Place the 
pointer over the border of the frameset until it changes into a double- 
headed arrow. Then drag the frameset to its new position. 


Changing the onentation of frames 


You can change the orientation of a frame or a group of frames to vertical 
or horizontal. To change the orientation of an individual frame, select the 
frame, and then drag it to a new location. When you change the orientation 
of a group of frames, all the frames within that frameset border change. 


To change the orientation of a frameset: 


1. Select a frame within the frameset you want to change, and click the 
Select Parent Frameset button [i] or Select Root Frameset button (GJ. 














The root frameset includes all frames and parent framesets on the page. 
2. Open the Frame List Object Editor. 
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3. Click the Appearance tab. 
4. Choose Horizontal or Vertical from the Direction pop-up menu. 


All the frames within the frameset change their orientation as 
selected. 


Adding other HTML attributes to a frame 


You can add your own HTML attributes to a frame or frameset by 
specifying it in the Frame or Frame List Object Editor. 


To specify additional attributes for a frame: 


1. Select the frame, parent frameset, or root frameset and open its object 
editor. 


2. Click the Extended tab. 


3. Type the desired HTML in the Extra HTML Attributes text box. To apply 
the new settings, press Tab or close the object editor. 


Note This is an advanced feature that requires knowledge of HTML; it 
specifies additional attributes for the <FRAME> tag. 


Creating a navigational frame layout 


You can set up a navigational frame that contains a list of links and make 
the linked pages display in another frame. This is useful for creating a 
table of contents for your Web site that always remains visible. 


= Espresso Cafe 
wuat’sNew. yhuat’s Cool: vestin. .wne 


home page 
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To create this type of layout you need to create a navigational frame and 
a target frame, assign a page to each frame, and name the target frame. 
Then you need to create links in the navigational list to the pages in your 
site and refer each to the target frame. 


Before you set up the frames, you need to create the pages for your Web 
site, including the page that contains the navigational list. 


To create a navigational frame layout: 


1. 


Open the Web page that contains your navigational list and the first 
page you want to display in the target frame. 


Usually the first page you want displayed in the target frame is the 
first item in the navigational list. 


. Create a page that uses frames by choosing New from the File menu, 


clicking Create New, selecting Frame Page and clicking OK. 
A list of the open Web pages appears in the Frame dialog box. 


. Select the page that contains the navigational list and then select the 


first page you want displayed in the target frame. 


. Click OK. 


An untitled page appears with two frames displaying the two assigned 
pages in Edit Frame mode. 














Widen cee) x] 
Select files for inclusion in the new Frame Document: 
M C:\Web Pages\primary.htm 
M C:\Web Pages\Chp3i8.htm 
Add File... Dociiment Orientation: |Horizontal FF) 
OK Cancel 








5. Double-click the target frame to open the Frame Object Editor. 


6. Click the Content tab, if necessary. 


Note If you want to change the page that is assigned to the frame, type 
the new name in the URL text box or choose it from the URL pop-up 
menu in the Frame Object Editor. 
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7. In the Frame Name text box, type a name for the target frame. 
Type a name that’s easy to remember, such as “target.” 


8. Close the Frame Object Editor and save the page. 


Note To modify the message that your audience will see if their 
browsers don’t support frames, click the Edit Page button on the 
toolbar and type a new message. To switch back to the frames, click 
the Edit Frames button. 


9. In the page that contains the navigational list, specify the target frame 
for each linked page. Do one of the following: 


= If you’ve already created the links in navigational list, you’ ll need 
to specify the target frame for each link individually. See 
“Specifying the target frame for linked pages” next. 


= Ifyou haven’t created the links yet, you can set up a default target 


frame that’s automatically referred to by every link you create. See 
“Creating links that refer to the target frame” on page 8-14. 


Specifying the target frame for linked pages 
When you create a navigational frame layout, each item in the 
navigational list that is linked to a page must also refer to the target 
frame. You specify the target frame for each link in the navigational list 
using the Link Editor. 


Note If you haven’t created the links yet, you can set up a shortcut so that 
you’ ll only have to specify the target frame once. See “Creating links 
that refer to the default target frame” next. 


To specify the target frame for each link in the list: 


1. In the page that contains the navigational list, select the first item in 
the list and click the Link Editor button |B] on the toolbar. 


If necessary, click the triangle > to expand the Link Editor. 





URL: | Fy 
Browse Files... Show Examples 


ew 





Target Frame: 
Extra HTML: 
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~ Link Editor 





ms [dS 


' Browse Files... |] [Re ink] [| Show Examples | 


> 
Target Frame:[ 
extra wr: Dd 














Note The name of the page that the item is linked to appears in the 
URL text box. (If you haven’t created the link yet, this box is blank. 
See “Creating links that refer to the default target frame” next.) 


2. In the Target Frame text box, type the name of target frame. 


Be sure to match the name of the target frame exactly as you typed it 
in the Frame Object Editor (for example, “target’”’). 


3. Repeat these steps for every item in the list and save the page. 


You can test the page that uses frames in Preview Page mode by clicking 
the links in the navigational frame and viewing the alternating pages 
displayed in the target frame. 


Creating links that refer to the target frame 


You can set up a default target frame that Claris Home Page 
automatically refers to whenever you create a link. This is useful if you 
haven’t created the links yet in your navigational list to the pages you 
want displayed in a single target frame. 


Note You can specify a different target frame for individual links in the 
Link Editor. 


To create links that automatically refer to the target frame: 


1. In the page that contains the navigational list, choose Document 
Options from the Tools menu (Windows) or Edit menu (Macintosh). 


. Click the Parameters tab in the Options dialog box. 
. Type the name of the target frame in the Default Target Frame text box. 
. Click OK to close the Options dialog box. 


oa Ff WwW NY 


. Create links to all the pages by selecting each item in the list, 
choosing Link to File from the Insert menu, selecting the page you want 
to link the list item to and clicking Open. 
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For each link you create, the target frame is automatically specified. 
You can change the target frame for an individual link by selecting 
the link, opening the Link Editor, and typing a new name in the Target 
Frame text box. 


For more information on creating links, see “Linking to external Web 
pages and resources” on page 7-6. 


You can test the frame layout in Preview Page mode by clicking the 
links in the navigational frame and viewing the alternating pages 
displayed in the target frame. 


Chapter 9: Adding forms to your Web page 





Forms provide a way of soliciting information from people who visit 
your site. You can use Claris Home Page to create interactive forms that 
your audience can use to order a product, provide feedback, fill out a 
questionnaire, or access a database. 


CGI (common gateway interface) script forms require a CGI that is 
specifically designed to process the data entered by your Web audience. 
The CGI must run on the Web server. Many Internet service providers 
have ready-made CGI programs that need little or no modification to use 
with the form pages in your site. You can find links to CGI scripts and 
CGI resources on the Claris Home Page technical support Web page at 
http://www.claris.com/support/products/clarispage/. 


Note You can also create forms that work directly with FileMaker Pro 
databases. For more information about using FileMaker Pro with Claris 
Home Page, see chapter 10, “Connecting to a FileMaker Pro database.” 


Inserting a form area 


When you create a form in Claris Home Page, you insert a special form 
area in your page to contain the form elements, such as text areas or 
check boxes, and a submit button, and the reference link to the CGI 
script. The form area can contain anything else you want to add, such as 
text and images. 


You can have multiple form areas on a page, but each form area can have 
only one CGI script associated with it to process the data that is entered 
in that area. 


To insert a form area in Claris Home Page: 


1. Place the insertion point in the Web page where you want the form 
to go. 

2. Choose Form from the Insert menu, and then choose Form Area from 
the submenu. 


A form area with a red border appears in the page, and the Form Area 
Object Editor opens. 
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TT 


Once you have inserted the form area, you can add form elements and 
other Web page elements to it, and specify the form action (location of 
the CGI script) in the Form Area Object Editor. 


Specifying the form's CGI script 
You use the Form Object Editor to specify the action and method of the 
form. The form action is the URL of the CGI script on the Web server 
and the method describes how to send the information to the server. 
Which action and method you specify depends on the instructions you 
receive from the server administrator. 


To specify the form’s CGI script: 


1. Open the Form Object Editor by double-clicking the red border of the 
form area in your page. 











Parameters 


action: J 
Method: 
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2. In the Action text box, type the path of the data-handling CGI script 
on the server. For example: 


/cgi-bin/public/counters/count.acgi 


What you type in the Action text box depends on instructions you 
receive about the CGI script’s name and location on the server. 
Consult your Internet service provider or Web server administrator 
for the appropriate information for your form and CGI. 


3. Choose Post or Get from the Method pop-up menu. 


Verify this choice with your Web server administrator or Internet 
service provider. 


4. Close the Form Area Object Editor. 


5. Save your page. 


Adding elements to the form 


A form area can contain any number of form input elements for your 
audience to use. These include text fields, password fields, text areas, 
check boxes, radio buttons, pop-up menus, scrolling lists and submit and 
reset buttons. You can add hidden entry form elements to store 
information about the form that is hidden from your audience. You can 
also add other HTML elements such as text and images to the form area. 


1. How did you hear about Espresso Cafe? 





2. What attracted you to our company and its product line? 











3. Have you ordered from us before? 





Every form input element needs a name and a value that is used by the 
CGI script to process the information. After you insert a form element 
into the form area, you can use its object editor to specify its name and 
value. You can also use the element’s object editor to specify other 
parameters such as the size that it displays on the page. 
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Note You can change form elements the same way you change other 
Web page elements; that is, you can copy them, move them around, and 
resize them using the same basic methods. See “Cutting, copying, and 
pasting” on page 2-7 and “Resizing elements using the mouse” on 
page 2-11 for more information. 


Inserting form elements 


You can use the Insert menu or the Forms tool palette to insert form 
elements into the form area. 


To insert a form element using the menu: 


1. Place the insertion point in the form area on the page where you want 
the element to appear. 


2. Choose Form from the Insert menu and then choose an element from 
the submenu. 





Claris Home Page inserts the form element and opens its object 
editor. 


To insert a form element using the Forms tool palette: 


1. Choose Forms Palette from the View menu (Windows) or choose Show 
Forms Palette from the Window menu (Macintosh). 
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la Forms | 





2. Select a form element icon and drag it from the palette to the form 
area on your page. 


Drag this icon To insert this form element 


A check box 

A radio button 
A submit button 
A reset button 
A text area 


A text field 


Heese 
[8 |\[8 


A password field 


(Ea) A scrolling list/pop-up menu 





Using the form element's object editor 


You can use the object editor for each form element to set the name and 
value of the element and other attributes, such as display size. 


When you insert a form element into the page, Claris Home Page 


automatically opens its object editor. You can also open the object editor 
by doing one of the following: 


= Double-click the form element. 


= Select the form element and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu 
(Macintosh). 


Select the form element and click the Object Editor button [Bij on the 
toolbar. 


Select the element by clicking it so that its selection handles appear, 
and then click the right mouse button (Windows) and choose Form 
Object Editor from the context menu that appears. On Macintosh, hold 
down the Control key and then click the mouse button before 
choosing Form Object Editor from the context menu that appears. 
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Adding a text field 


Text fields can contain only one line of text, can be 1 to 500 characters 
wide, and can only be resized horizontally. These fields are generally 
used for shorter information such as a name or phone number. 


_ T 


To add a text field to the form area: 
1. Place the insertion point inside the red border of the form area. 


2. Choose Form from the Insert menu, and then choose Text Field from the 
submenu. 


Claris Home Page inserts a text field form element and opens the Text 
Field Object Editor. 











Appearance 


Name: 
Size: 
Max Length: [| 











3. In the Text Field Object Editor, type a descriptive name for the text 
field in the Name text box. 


For example, Phone Number. 





Adding forms to your Web page 9-7 


4. In the Size text box, type a number from 1 to 500. 


The number you type here determines the display size of the text field 
in the browser window. 


5. In the Max Length text box, type the maximum number of characters 
(from 1 to 1000) someone can enter in the text field. 


6. Close the Text Field Object Editor to apply your settings. 

You can enter sample text in the text field to show your audience what 
kind of information to enter, and to provide a default value if nothing is 
entered in the field. 

To enter sample text in the text field: 


= In Edit Page mode, click inside the text field so that the insertion point 
appears, and then type your sample text. 


Adding a text area 


Text areas allow your audience to enter multiple lines of text, which they 
can scroll through using the scrollbars. 


This is an example 
of 4 text area. 





The display size of a text area is measured in rows and columns where 
each row is equivalent to one character in height and each column is 
equivalent to one character in width. A text area can be | to 100 rows tall 
and 5 to 500 columns wide. This display size of a text area does not limit 
the amount of text that your viewers can enter; if more text is entered, 
the text area will scroll. 


To add a text area to the form area: 
1. Place the insertion point inside the red border of the form area. 


2. Choose Form from the Insert menu, and then choose Text Area from the 
submenu. 


Claris Home Page inserts a text area form element and opens the Text 
Area Object Editor. 
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name: 
7 
27 














Virtual 





ce =3Text Area 
Appearance 
Name: 


Rows: |? 
Columns: |27 





Wrap: |Virtual w ] 

















3. In the Text Area Object Editor, type a short descriptive name in the 
Name text box. 


4. In the Rows text box, type a number from 1 to 100 to set the height of 
the text area. 


5. In the Columns text box, type anumber from 5 to 500 to set the width 
of the text area. 


6. Choose Virtual, Physical, or Off from the Wrap pop-up menu to set the 
type of word wrapping in the text area. 


Choose Virtual to wrap text onscreen, but not include line break 
characters with the form data. Choose Physical to wrap text onscreen 
and include line break characters with the data. Choose Off to disable 
word wrapping onscreen, and include line break characters in the 
form data if a viewer types them. 


7. Close the Text Area Object Editor to apply your settings. 


Adding a list of radio buttons 


Radio buttons allow your audience to select exactly one choice from a 
list of options. Only one radio button in a list can be selected at a time. 


You need to assign the same name to every radio button in a list so they 
can work together. In addition, you must assign a unique value to each 
radio button or check box to differentiate it from the others in the list. 
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To add a radio button to an item in a list in the form area: 


1. Place the insertion point inside the red border of the form area, next 
to the first item in the list. 


2. Choose Form from the Insert menu and then choose Radio Button. 


Claris Home Page inserts a radio button form element and opens the 
Radio Button Object Editor. 


tadio5920736 


_ 











Button Name: |radio5920736 


Oo Checkea 








3. In the Radio Button Object Editor, type a short descriptive name in 
the Button Name text box. 


The name you type describes the set or group of items that the radio 
button belongs to in the list. This name needs to be the same for every 
radio button in a group or list and can be letters, numbers or a 
combination of both. 


4. In the Button Value text box, type a unique description for the radio 
button. 


This value needs to be different from every other button in the list. 
The values can be letters, numbers or a combination of both. The 
value you type here is returned to you by the CGI script when the 
form is submitted and tells you which radio button someone clicked 
in the list. 
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5. Select Checked if you want the radio button to appear selected by 
default. 


The default choice is selected unless the viewer selects a different 
button or check box in the list. 


Note Only one radio button in a list can be the default button. 


6. Close the Radio Button Object Editor to apply your settings. 


Adding a check box 


You can add a single check box to a form or multiple check boxes to a 
list of choices in a form. Check boxes allow the viewer to select as many 
choices as they like from the list. Make sure radio buttons that belong to 
the same group are named the same. Similarly, check boxes belonging 
to the same group must also be named the same. 


@ Please send me your full-color catalog. 


To add a check box to the form area: 
1. Place the insertion point inside the red border of the form area. 
2. Choose Form from the Insert menu and then choose Check Box. 


Claris Home Page inserts a check box form element and opens the 
Check Box Object Editor. 





checkbox977 








_] 
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=3 Check Box 


Parameters | Extended 


Button Name: |checkbox977 
Button Yalue: 


(J Checked 











3. In the Check Box Object Editor, type a descriptive name in the Button 
Name text box. 


If you have a group of check boxes in a list, the name you type 


describes the group. This name needs to be the same for every check 
box in the group and can be letters, numbers or a combination of both. 


4. In the Button Value text box, type a unique description for the 
check box. 


The value you type can be letters, numbers or a combination of both. 
This value is returned to you by the CGI script when the form is 
submitted and tells you which check box someone has clicked in the 
form. 


5. Select Checked if you want the check box selected by default. 
The check box is selected unless the viewer clicks it. 


6. Close the Check Box Object Editor to apply your settings. 


Adding a pop-up menu or scrolling list 


Pop-up menus and scrolling lists allow your audience to choose from a 
list of items. A pop-up menu shows only one item in the list until 
someone clicks on it. A scrolling list shows more than one item, and 
your audience can scroll to see the remaining items in the list. 


Kenya 
Pop-up menu You can specify whether viewers can choose one item at a time or select 
multiple items in the list. 
ean To add a pop-up menu or scrolling list to the form area: 


French Roast [J 7 . re 
1. Place the insertion point inside the red border of the form area. 


Scrolling list 
: 2. Choose Forms from the Insert menu and then choose Pop-up Menu 


from the submenu. 
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Claris Home Page inserts a pop-up menu form element and opens the 
Pop-up Object Editor. 








Appearance 


Name: 
Items Yisible: [1] [_Edit Items... 


CD Allow Multiple Selections 





3. In the Pop-up Object Editor, type a descriptive name for the pop-up 
menu in the Name text box. 


4. In the Items Visible text box, type the number of items you want to 
appear on the page before your audience interacts with it. 


Type 1 if you want the element to be a pop-up menu. Type a number 
greater than one (2—100) if you want the element to be a scrolling list. 


5. Select the Allow Multiple Selections check box if you want your 
audience to select more than one item in the list. 


If you leave this check box unselected, your audience can select only 
one item in the list at a time. 


6. Click Edit Items to create the list of items and specify their values. 
The Define Pop-up List dialog box appears. 
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eR 














7. In the Define Pop-up List dialog box, click Add to add each new list 
item to the list. 


8. In the Title column, type the names of the items as you want them to 
appear in the pop-up menu or scrolling list. 


9. Click in the Check column next to the items that you want to appear 
as selected by default in the form. 


Acheckmark v appears in the Item List scrolling area next to each 
item you specify as a default choice. If the list item appears in a pop- 
up menu, a checkmark indicates that it is selected by default. If the 
list item appears in a scrolling list, it’s highlighted to indicate that it’s 
selected. 


10.In the Value column, type a description of the list item. 


This value can be the same as the item’s title and must be different 
than the other items in the list. You can type letters, numbers or a 
combination of both. 

11.Click Remove if you want to delete an item from the list and click OK 
when you’re done. 


12.Close the Pop-up Object Editor to apply your settings and save your 
page. 
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You can test the functionality of the pop-up menu or scrolling list by 
clicking on the list items in Preview Page mode. 


To test the pop-up menu or scrolling list: 
= Click the Preview Page button [Bj on the toolbar. 


= Choose list items from the list or click them to select them. 


Adding a password field 


Password fields are identical in all respects to text fields, except that 
when text is typed in them, the characters display as asterisks or bullets 
rather than text. 


Passwordreqised [id 


Password required: [sere 


To add a password field to the form area: 
1. Place the insertion point inside the red border of the form area. 


2. Choose Forms from the Insert menu and then choose Password from 
the submenu. 


Claris Home Page inserts a password field form element and opens 
the Password Field Object Editor. 
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=3 Password Field 


Parameters | Extended 


Name: 
Size: 


Max Length: ; | 








3. In the Password Field Object Editor, type a descriptive name for the 
text field in the Name text box. 


4. In the Size text box, type a number from 1 to 500. 


The number you type here determines the display size of the 
password field in the browser window. 


5. In the Max Length text box, type the maximum number (from 1 to 
1000) of characters someone can enter in the password field. 


6. Close the Password Field Object Editor to apply your settings. 


Adding a reset button 


E 


You can add a reset button to the form areas so your audience can restore 
a form to its original state and clear their form entries. This is helpful if 
the viewer makes a mistake or wants to submit new form data. 


Reset buttons must call a CGI script to function properly. For this 
reason, you won’t be able to test their functionality in Edit Page or 
Preview Page mode. 


To add a reset button to the form area: 


1. Place the insertion point inside the red border of the form area. 


2. Choose Forms from the Insert menu and then choose Reset Button from 
the submenu. 


Claris Home Page inserts a reset button form element and opens the 
Reset Button Object Editor. 
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ait dP Cel) 


Parameters 


Use this window to set parameters for an object selected in 
the front document or library window. (Reset buttons 
have no settable parameters.) 








3. Close the Reset Button Object Editor. 


When you add a reset button to your form, a default label, Reset, appears 
in it. 
To change this label so that the viewer sees something different: 


= Double-click the text Reset in the form element to select it and type 
the new text. 


Adding a submit button 


You need to include a submit button for your audience to send their 
information. Each time someone clicks the submit button, the 
information filled in the form area is sent to the CGI script. 


You can add more than one submit button and assign a different action 
name to each one that corresponds with the different actions supported 
by the CGI script. When someone clicks on a particular submit button 
on your form, the data is sent to the CGI script and handled according to 
the action specified for that submit button. For example, one submit 
action name may add a record to a database. Another action name may 
delete a record. 
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Submit buttons must call a CGI script to function properly. For this 
reason, you won’t be able to test their functionality in Edit Page or 
Preview Page mode. 


To add a submit button to the form area: 
1. Place the insertion point inside the red border of the form area. 


2. Choose Forms from the Insert menu and then choose Submit Button 
from the submenu. 


Claris Home Page inserts a submit button form element and opens the 
Submit Button Object Editor. 





Tae sh tog) 


Parameters 
Action Name: 








3. If you’re adding more than one submit button to your form, type the 
name of the action in the Action Name text box. 


The action name identifies how the button works and is not the button 
label. 


Note Some older browsers do not support multiple submit buttons 
associated with separate names and values or actions. Also, actions 
supported by a CGI will vary from script to script. Check the 
documentation that comes with your CGI script to be sure you use an 
action name that is supported by your CGI. 





9-18 Claris Home Page User’s Guide 


4. Close the Submit Button Object Editor. 


When you add a submit button to your form, the default label appears 
in it. 
To change this label so that the viewer sees something different: 


= Double-click the text Submit in the form element to select it and type 
the new text. 


Using an image as a submit button 


You can turn an image into a submit button, so that when someone clicks 
on the image, the form is submitted. 


For information on other ways to use an image, see “Making images 
interactive” on page 4-10. 


To use an image as a submit button: 
1. Insert the image into the form area on your page. 
2. Double-click the image to open the Image Object Editor. 


3. Click the Behavior tab in the Image Object Editor and select Form 
Submit Button. 


4. Click the Appearance tab, type the action name (for example, submit) 
in the Name text box. 


Note Some older browsers do not support multiple submit buttons 
associated with separate names and values or actions. Also, actions 
supported by a CGI will vary from script to script. Check the 
documentation that comes with your CGI script to be sure you use an 
action name that is supported by your CGI. 


5. Close the Image Object Editor to apply the new setting. 


Adding a hidden entry 


Hidden entry form elements allow you to supply additional information 
to the CGI script without displaying the information on your Web page. 
When viewers submit their forms, hidden entry data is sent to the server 
along with the data they have entered in the form. 


To add a hidden entry to the form area: 


1. Place the insertion point inside the red border of the form area. 





Adding forms to your Web page 9-19 | 


2. Choose Forms from the Insert menu and then choose Hidden Entry from 
the submenu. 


Claris Home Page inserts a hidden entry form element and opens the 
Hidden Form Entry Object Editor. 





erent 











Parameters 


Entry Nome: 
Entey Value: 





3. In the Hidden Form Entry Object Editor, type the appropriate values 
in the Entry Name and Entry Value text boxes. The Entry Name 
identifies the value entered in the Entry Value. 


4. Close the object editor to apply your settings. 


Note Because hidden entries are invisible to the viewer, they don’t 
appear when you view your Web pages in Preview Page mode or in 
a browser. 
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Testing your forms 


Forms are not complete until they behave exactly as you intended, which 
includes the data processing that is done by the CGI scripts. 


You can use Preview Page mode to test the functionality of all of the 
form input elements except for the reset and submit buttons. 





This form element Functions this way in Preview Page mode 
Text field You can type in text in the Text Field Object Editor. 
Text area You can type in text in the Text Area Object Editor and use the 


scroll bars to see all of the text that you typed. 





Password field You can type in it as many characters as you specified in the 
Password Object Editor. When you type, asteriks or bullets 
appear instead of the characters. 


Radio button in a list When you click on the button, all other radio buttons in the list 
(as specified by their group name) are unselected. You can only 
select one radio button at a time. 





Check box You can click the check box to select it and unselect it. 





Pop-up menu Only one item appears. When you click on the item, the pop-up 
menu appears. If you selected Allow Multiple Selections in the 
Pop-up Object Editor, you can select more than one item in the 
list and a checkmark appears next to each one. 





Scrolling list A scrolling list appears with the number of items you specified. 
You can scroll to see more items. If you selected Allow Multiple 
Selections in the Pop-up Object Editor, you can select more than 
one item in the list and each one appears highlighted. 





Hidden entry Nothing appears. 





To test form behaviors, such as the submit and reset buttons, and other 
relevant data processing functions, your form must be running on a Web 
server with the appropriate CGI script as specified in the Form Area 
Object Editor. See “Specifying the form’s CGI script” on page 9-2 for 
more information. 


Chapter 10: Connecting to a FileMaker Pro database 





You can use Claris Home Page to create special pages that give your 
Web audience access to a FileMaker Pro 4.0 database file that is open 
and shared across a TCP/IP network. The number and type of pages you 
create depend on the level of access or privileges you give your audience 
and what features you want to include on your pages. 


For a general understanding of HTML forms, see chapter 9, “Adding 
forms to your Web page”. 


To create FileMaker Pro form pages, you use the CDML (Claris 
Dynamic Markup Language) tags to specify database fields, and 
database actions, such as searching, deleting, duplicating, editing, and 
creating new records. 


There are two ways to connect your Web site to a FileMaker 4.0 
database: 


=» You can use the FileMaker Connection Assistant, which creates an 
entire Web site that connects to a FileMaker Pro database. 


= You can use the FileMaker Connection Libraries of CDML tags and 
insert them into existing pages. There are two libraries, the FileMaker 
Form Library and the FileMaker Reference Library. 


You also need FileMaker Pro 4.0, available separately from Claris 
Corporation. FileMaker Pro 4.0 includes the FileMaker Pro Web 
Companion plug-in, which acts as both a Web server and a CGI 
application by serving Web pages over the Internet or an intranet and 
processing database requests from the browser. 


Preparing the FileMaker Pro database 


Most likely, the database you want to publish already has a number of 
records that can be searched by your Web audience. You can also 
publish a database that contains no records and have your Web audience 
“populate” it by creating records from their browsers. 
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Follow these guidelines for preparing the database to be accessed from 
the Web: 


= Make sure that the FileMaker Pro database is in good working order 
(see the FileMaker Pro documentation for information on recovering 
corrupt databases and general file maintenance). 


= To avoid character encoding problems, avoid using special characters 
such as the following in the database file, layout, and field names: ; / 
2:@=&><#%{}'I\4~[] >” ©" (Space). 


= The database should have a layout with all the fields that will be used 
when the database is accessed from the Web. This layout should not 
contain any fields that won’t be accessed from the Web. 


= The fields should have the desired formatting (currency, date, 
thousands separator, etc.) 


= If you plan on using the FileMaker Connection Assistant, the 
database file must be open on the machine where you use Claris 
Home Page or on the network you have access to. 


= The options for Web sharing must be set for the FileMaker Pro 
application and the database you want to access. See the 
FileMaker Pro documentation for more information on enabling the 
FileMaker Pro Web features both for the database and for the 
application itself. 


Creating FileMaker Pro forms and sites 


When you publish a FileMaker Pro database in your Web site, you 
create pages that support the actions performed by your Web audience 
when they interact with the database. Every action is initiated from a 
FileMaker Pro form and has two possible responses: success and error. 
In the case of success the action or request leads to another page to 
display the reply or results. In the case of an error, the request leads to 
an error page that usually explains the error. 





Connecting to a FileMaker Pro database 10-3 

























































































Enron | SEARCH 
ERROR 
SEARCH 
FORM 
RECORD 
a syconsse | (EPL ERROR 
RECORD 
DEX ~~] DETAIL 
FORM RECORD 
NEW DETAIL 
ERROR_| pecorD “~—~—~a. | REPLY 
——. | "EanOR SUCCESS 
NEW 
RECORD 
FORM jew 
RECORD 
— 
success” |_FEPLY 











You can design your site, and then use either the FileMaker Connection 
Assistant or the FileMaker Form Library to create a site that connects to 
a FileMaker Pro database. If you use the FileMaker Connection 
Assistant to create the site, you first decide the features and privileges 
that you want, and then go through the assistant panels to set up the site. 
When you are done with the assistant, Claris Home Page creates all the 
necessary pages and links for a basic site that connects to a 

FileMaker Pro database. 


If you use the FileMaker Connection Libraries to create a site, you use 
the FileMaker Form Library to create FileMaker forms and the 
supporting reply and error pages. When using the FileMaker Form 
Library to create pages, it is not necessary to have the database open. 
However, it is necessary to have the following information: 


= the filename of the database (For Windows, this includes the *.FP3 
filename extension.) 


= the exact name of each layout in the database that will be used by the 
FileMaker Pro form pages 


= the exact names of the fields used in the FileMaker Pro form pages of 
your site (It is helpful to print out field definitions to keep track of the 
field names.) 


= the exact filenames of all pages that will be in the site, including error 
and reply pages 


See “Using the FileMaker Connection Libraries” on page 10-24 for 
more information on using the FileMaker Connection Libraries to build 
a site that connects to a FileMaker Pro database. 
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Using the FileMaker Connection Assistant 


Claris Home Page provides an assistant that you can use to create all the 
necessary FileMaker forms to connect to a database. With the assistant, 
you specify the filename of the database file and the layout, the fields 
you want to appear on specific pages, and the access privileges and 
features you want to provide to your Web audience. The FileMaker 
Connection Assistant creates all of the necessary form pages and links 
based on the options you choose. 


To use the assistant, you need the following: 


= local or remote access to a prepared database, which must be open 
before you begin 


= the IP address of the remote computer hosting the FileMaker Pro 
database file 


= Export records privileges enabled in the database file 
= TCP/IP networking installed and configured on your computer 


= Web sharing enabled for the FileMaker Pro application and for the 
database you want to access. 


To open the FileMaker Connection Assistant: 

1. Choose New from the File menu. 

2. Click Use Assistant. 

3. Select FileMaker Connection Assistant in the scrolling list. 
4. Click OK. 


SSS FileMaker Connection Assistant 


2 | Overview 


This assistant creates a Web site that will let your Web 
audience access a FileMaker database from the Web. The 
pages created by this assistant can be edited further in Claris 
Home Page. You create the site here, and then upload it to the 
Web server where FileMaker Pro is running. In this 
assistant, you can choose: 


@ The FileMaker database. This database must be running 
on your computer or on the network as you go through 
this assistant. 

@ The features and privileges you would like people visiting 
your Web pages to have when they access your FileMaker 
database. 

@ And more! 


oe (Finish <Back | [Next> _] 
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The assistant displays a series of panels. When you complete the 
settings on a panel, click Next to continue. 


FileMaker Connection Assistant 


—4. Before You Begin 


FileMaker Pro Version 4.0 includes integrated HTTP web server features that 
allow FileMaker Pro databases to be accessed over the Internet. 


This assistant will lead you through the steps needed to create HTML pages 
that access a FileMaker Pro database. In order to connect to FileMaker Pro. 
you must have TCP/IP installed on your computer and have either local or 
remote access to FileMaker Pro (Version 4.0 or greater). 


Please note, the FileMaker database you wish to connect to must be open and 


the FileMaker ‘Web companion turned on in order to use this assistant. If you 
are using FMP security, then the security database must also be open. 





Note The assistant is designed to be completed in a single session. 
When you click Cancel, Claris Home Page ends the session, and all 
settings entered up to that point are lost. 


5. Click Next to select the FileMaker Pro database that you want your 
Web audience to have access to. 


Selecting the FileMaker Pro database 


On the Database Selection panel in the FileMaker Connection Assistant, 
you see the names of databases running on the server you specify. 


ileMaker Connection Assistant 


=. Database Selection 


F Select database: 
Specify server 


IP Address: 
Password:[__ 
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To select a database: 


1. 


4. 


In the IP Address text box, type the IP address of the computer where 
the FileMaker Pro database is open. 


Click This computer to enter the IP address of the computer you are 
working on. To connect to a server on the network, ask your network 
administrator for the IP address of the remote computer you want to 
access. 


. Type your user name in the User Name text box, and then type your 


password in the Password text box. 


If your database file is set up to use the Web Security database, enter 
your user name and password. If your database file is using 
FileMaker Pro access privileges for security, enter only the password. 
See the FileMaker Pro documentation for more information on 
security and access privileges. 


. Click Connect to server. 


A list of databases appears in the scrolling list of the Database 
Selection panel of the assistant. 


Select the database you want, then click Next. 


Important If the connection to a FileMaker Pro database is unsuccessful, 
you will want to verify the following: 


The files you want to access are running either on your own computer 
or over the network. 


The IP address is correct. 
The password and user name are correct. 


The Web companion is set up in the FileMaker Pro application, and 
Web sharing is set up for the database file. 


Choosing a FileMaker layout 


On the Choose a FileMaker Layout panel, you can choose the FileMaker 
layout containing the fields you want. The fields on the layout you select 
will be used by the assistant to create the pages of your site. Make sure 
the layout contains all the fields that will be used for the entire site, 
which may include fields for searching and sorting the database as well 
as fields that will be used to create new records and to display record 
information. Select the layout name in the Layout pop-up menu, and then 
click Next to continue with the FileMaker Connection Assistant. 
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FileMaker Connection Assistant 


Layout Selection 
j Choose the FileMaker layout you wish to use. 


Layout: Choose a layout that contains all of the fields you 
Detail v ] wish to use in your FileMaker-connected Web site. 


‘You will select the specific fields and how to use 





Fields in selected layout: them later in this assistant. 

Employee Number 

sara fea while you may choose any layout, your web 
audience will get the best performance if you 

Edit Date choose a layout that contains only the fields that 

lEdit Time you need. 

First Name 

Last Name 


[Shift 














Setting features and privileges for your Web audience 


On the Feature Selection panel in the FileMaker Connection Assistant, 
you set options for how you want your Web audience to interact with 
your database. 


leMaker Connection Assistant 


eo Feature Selection 


Select the features /privileges you want visitors to your Web site to have. The 
selections you make here will determine the pages that will be created by this 
assistant. 
& Search a database for specific information and return a list of results. 
& View details on individual records returned from a search, 

EX Edit individual records. 

& Delete individual records. 

& Duplicate individual records. 


& Add new records to a database. 





Using the assistant, you can create forms in your Web pages that allow 
your Web audience to: 


= search the database and view the search results in a list of records on 
a page 
= see a detailed view of each record in the search results 
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= edit, delete, and/or duplicate a record in the detailed view of the 


search results 


= add records to the database 


The options you select on the Feature Selection panel determine which 
pages the assistant creates. The assistant creates a page for every option 
you select as well as pages for displaying replies and error messages. 


If you select this option on 
the Feature Selection panel 


Search a database for specific 
information and return a list of 
results 


The assistant 
creates these pages 


Index page 

Search page 

Search Results page 
Error page 


With these filenames 


default.htm 
search.htm 
search_results.htm 
search_error.htm 





View details on individual 


Index page 


default.htm 








records returned from a search Search page search.htm 
Search Results page search_results.htm 
Details page record_detail.htm 
Error page search_error.htm 
Edit individual records Index page default.htm 
Search page search.htm 
Search Results page search_results.htm 
Details page record_detail.htm 
Edit Reply page record_detail_reply.htm 
Error pages search_error.htm 
record_detail_error.htm 
Delete individual records Index page default.htm 
Search page search.htm 
Search Results page search_results.htm 
Details page record_detail.htm 
Delete Reply page record_detail_reply.htm 


Error pages 


search_error.htm 
record_detail_error.htm 





Duplicate individual records 


Index page 

Search page 

Search Results page 
Details page 
Duplicate Reply page 
Error pages 


default.htm 

search.htm 
search_results.htm 
record_detail.htm 
record_detail_reply.htm 
search_error.htm 
record_detail_error.htm 





Add new records to a database 


Index page 

New Record page 

New Record Reply page 
Error page 


default.htm 
new.htm 
new_reply.htm 
new_error.htm 
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When you click Next, the FileMaker Connection Assistant displays 
additional panels for setting options for each page, based on your 
selections. 


For example, if you create a site that lets your Web audience only search 
and view records, the FileMaker Connection Assistant creates the 
following pages: 


= an default.htm that is an entry point into the pages of your Web site 
that access a FileMaker Pro database 


= asearch.htm page for submitting a search request to the 
FileMaker Pro database 


= asearch_results.htm page for displaying search results 
= adetails.htm page for viewing details for a single record 


= asearch_error.htm page for displaying an error (for example, “zero 
records found”’) in processing the search request, which can prompt 
the viewer to submit the request again. 








index_for_fmp.htn search. ttm 


Would you 
Erter your: 


like to 
> search 


criteria here: 
Search our 
database? 


Eph ee eee 






































search_error.hbml search_resuts.hbn record_detail.htm 
No records 
matched your Here are the View more 
search crteria. resuts of your > information about 
search asingk record 
Try another here 
search. Click here to 
see details _ New search 
Thanks: 











The FileMaker Connection Assistant creates all the necessary pages and 
saves them in a folder you specify. You can edit the pages further using 
the Claris Home Page editing tools and the FileMaker Connection 
Libraries. Choose FileMaker Form Library or FileMaker Reference Library 
from the View menu (Windows) or the Window menu (Macintosh). 


Setting Search options 
You can specify which database fields you want to appear in the Search 
page of your Web site. In addition, you can specify whether the search 
information for each field is to be defined by your Web audience, 
whether the search is fixed, or a combination of fixed search criteria and 
criteria specified by your Web audience. 





10-10 Claris Home Page User’s Guide 


The Web audience can type search criteria in the search fields and 
specify field comparison operators. For example, in a search for a name 
in the Name field of a database, your Web audience can type search 
criteria in the field, and then they can choose “begins with” from the 
field comparison pop-up menu. If the Web viewer typed “Ignat” in the 
Name field as the search criteria, then the search results return records 
where the first characters of the Name field begin with that string of 
characters (for example, Ignat, Ignatius, Ignatowski). 


FileMaker Connection Assistant 


Search Page 


_ Add the fields you want the user to be able to search on, and set the search options 
» for each field. 
Search page fields: Field search criteria: 


Employee Number k @ Specified by web user 


Hire Date E 5 rs 
Postal Code © Fixed("canned") search 


First Name 


Last Name Operator : 


Field format: | Checkbox 
Department 
Job Description Value list: [Shift Value List 


Edit Date 
Job Description Field label: 
Vv 
oe ; 





In a fixed search, you predefine the search criteria (including the field 
comparison operator) for each field in the search. Your Web audience 
does not need to type search criteria in a field or choose the field 
comparison operator. 


You can use a fixed search to allow your audience to search for and 
display a set of records that is of interest only to them. For example, if 
your database contained daily menu information, your Web audience 
might be accessing your site to see only the menu choices for the day. 
Your fixed search would be on today’s date, and the search results would 
display records (menu information) only for the current date. 


To set up the Search page: 


1. Select a field in the Fields list. Then click the Add button. Repeat for 
each field that will appear in the Search page. 


All the fields you add appear in the Fields on Search page list. 
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2. Select a field in the Fields on Search page list. 


The field label is the name of the field as it will appear to your Web 


audience. 


You can change the field label by typing over it in the Field label 


text box. 


3. Set the search options for the selected field. 


Click 


To 


Have search results based on search criteria your 


Specified by Web user 


audience specifies for that field. 





Fixed (“canned”’) search 


Have search results based on the operator and search 
value you specify for that field. 





= If you selected Specified by Web user, choose a field comparison 
operator from the Operator pop-up menu, and then go to step 5. 


= If you selected Fixed, choose the operator for the field, and then 


continue. 


The operator you choose determines how records match the search 
criteria entered into a particular field. This determines which records 
are displayed in the search results. 


Choose this field 
comparison operator 


Equal to 


To show these search results to your Web audience 


Records that match the search criteria exactly 





Not equal to 


All records except those that match the search criteria 





Less than 


Records with values less than the search criteria 





Less than or equal 


Records with values less than or exactly equal to the search 
criteria values 





Greater than 


Records with values greater than the search criteria 





Greater than or equal 


Records with values greater than or exactly equal to the 
search criteria values 





Contains 


Records that contain the character or string of characters 
specified in the search criteria 





Begins with 


Records with the character or string of characters specified 
in the search criteria at the beginning of a value 





Ends with 


Records with the character or string of characters specified 
in the search criteria at the end of a value 
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. For a fixed search, type the search value in the Search value text box 


(For example, for a field called “Shift,” you might type “Full Time” 
to find only full time employees). Then go to step 8. 


You can type FileMaker Pro search symbols in addition to or instead 
of text you type here. For example, to find records with today’s date 
in a date field, type two forward slashes (//) in the Search value text 
box for the date field. 


Note The Search value text box is not available unless the Fixed 
(“canned”) search option is selected. 


. Fora Web user-defined search, you need to specify the HTML format 


(radio buttons, check boxes, pop-up menu, text field, or text area) for 
the field in the Field format pop-up menu. 


. To use a value list from the FileMaker Pro database, choose Pop-up 


menu, Radio button, or Check box in the Field format pop-up menu. 


Note The Values list text box is not available if the field format is text, 
text area, image, or read-only text. 


. Type the name of the value list in the Value list text box. 


Note The Number of items visible and Allow multiple selections options 
are available only when the field format selected is a pop-up menu. 


. Repeat steps 3 through 7 as appropriate for each field in the Fields on 


Search page list. 


. Click Next. 


The Search Page Logical Operator panel appears. 
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Setting the Search Page logical operator 


The Search page logical operator determines how records are searched 
when a search request is submitted. 


FileMaker Connection Assistant 


ot 
# Search Page Logical Operator 


This determines the “and/or” relationship of the fields on your search page. You can 
specify that all of the search fields must match before a record is returned ("and" 
relationship), or that any of the search fields can match (“or" relationship). To let 
the user specify when they view your page in a browser, choose "User specified". 


@ Fixed: [Or v 


oO User specified 





If the option is set to OR, the records in the search results are returned 
based on the search criteria matching one or more fields. If the option is 
set to AND, the records in the search results are returned based on all the 
search criteria matching. 


To set the logical operator for all searches made by your Web audience, 
click Fixed. To let your Web audience choose the logical operator for 
their searches, click User specified. 


After setting the Search page logical operator, click Next. The Search 
Results panel appears. 
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Setting options for the Search Results page 


Once a search request is submitted, the search results are returned to the 
Web viewer as a list of records that display on a separate Search Results 
page. You set options for this page on the Search Results panel in the 
FileMaker Connection Assistant. 


FileMaker Connection Assistant 


ma Search Results 
2) Add the fields you want to include in the records that are returned as a result of a 


search, and specify field and page options. 


Fields: Search results fields: 
lErmployee Nurmber [ Last Name 
Hire Date E First Name 


Edit Date Employee Number 


Edit Time Department 


First Name Hire Date Matches per page: 
Last Name Extension @® Limit to: 
Shift Email ©) No Timit 


IDepartment As 
oO Specified by user 
[Bonus Plan. 





To set up the Search Results page: 


1. Select a field in the Fields list. Then click the Add button. Repeat for 
each field that will appear in the Search Results page. 


2. Set the option for the number of records to display per page in the 
Matches per page area of the panel. 


The Specified by user option adds a pop-up menu element on the Search 
page, where the Web viewer can make a choice for the maximum 
number of records that will display per page of their search results. 


3. Click Next. 
The Sort Results panel appears. 
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Setting a sort order for search results 


On the Sort Results panel, you can specify whether the results for the 
search are sorted or not. 


FileMaker Connection Assistant 


se 
<2 Sort Results 


‘Would you like to specify a sort order for the records that are displayed in a 
results page? 


® Yes - Specify a predetermined sort order. 
oO Yes - Allow the Web user to select a field to sort with. 


© No sort order. 





= If you choose the Yes - Specify a predetermined sort order option, the 
search results are sorted before they are displayed in the search results 
page. For this choice, you choose the fields to sort by, and choose the 
sort order (ascending, or descending) in the next panel of the 
assistant. 


= If you choose the Yes - Allow the Web user to select a field to sort with 
option, the Search page contains a pop-up menu of all the fields 
featured on the Search page and a pop-up menu of the sort order 
choices (ascending, descending). The Web viewer can make the 
choices for sorting the records that are returned as search results. 


After setting the sorting options, click Next. If you selected the Yes - 
Specify a predetermined sort order option, the Predetermined sort order 
panel appears. Otherwise, panels for setting up any remaining pages in 
your Web site appear. 
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Setting a predetermined sort order for search results 


You can choose to sort search results so that records return to your Web 
audience in a specified order. 





FileMaker Connection Assistant 


. Predetermined sort order 
aj Add the fields you want to sort on, and specify field options. 


Results page fields: Sort order fields: Field options : 


Last Name Employee Number [| al © Ascending order 





First Name I O 
Descending order 
lErmployee Number ae 


To set a predetermined sort order for your search results: 


1. 
2. 
3. 


4. 


Select a field from the Search Results fields list. 
Click Add. 
Choose a sort order for the field. 


Ascending is the default value. Descending sorts the records from 
greater values to lesser values. 


Repeat these steps for as many fields as you want to sort on. 


After setting the predetermined sort order for your search results, click 
Next. Panels for setting up any remaining pages in your Web site appear. 
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Setting options for the Details page 
The assistant creates the Details page to display an individual record on 
an entire page. The Details page for a record appears in the browser 
when a Web viewer clicks the link (the contents of the first field for that 
record) in the list of records displayed in the Search Results page. 


If you selected record modification privileges on the Feature Selection 
panel, your Web audience can edit, delete, or duplicate individual 
records from the Details page. 


FileMaker Connection Assistant 


s Details Page 
mej This page displays details on individual records that have been returned from a 
» search. Add the fields you want to display, and specify field and record options. 


Fields: Details page fields: 


Ernployee Number Ss [=] Field label: 
Hire Date ss i E 
Field format: | Text Field v 


Edit Date Employee Number 
Edit Time Hire Date 

First Name Edit Date 

Last Name i 

[Shift 

Department 

[Bonus Plan. 





To set up the Details page: 
1. Select a field in the Fields list. Then click the Add button. Repeat for 
each field you want to appear in the Details page. 
The field label is the name of the field as it will appear to your Web 
audience. 
You can change the field label by typing over it in the Field label text box. 
2. Select a field in the Fields on Details page list. 


3. Specify the HTML format (radio buttons, check boxes, pop-up menu, 
text field, text area, or read-only text) for the field in the Field format 
pop-up menu. 


Note If you did not choose Edit Individual Records on the Feature 
Selection panel, the Field format pop-up menu, Values list text box, Items 
visible text box, and Multiple selections check box are not shown. 
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4. If you want to format the selected field as a pop-up menu, check 
boxes, or radio buttons, see step 6 on page 10-12 to use a value list 
defined in the FileMaker Pro database. 


5. Repeat steps 1 through 4 as appropriate for each field on your Details. 
page. 
6. Click Next. 


If you selected record creation privileges on the Feature Selection 
panel, the next panel that appears is the New Record panel. 


Setting options for the New Record page 


If you design your site so that your Web audience will be able to create 
new records, you can set options for information they can type and 
submit as a new record in the New Record Page panel. 


FileMaker Connection Assistant 


=. New Record Page 
mj This page lets users add records to the database. Add the fields you want to include in 


+ your Add Record Page, and specify field options. 


Fields : New record fields: 


State i [4] Field label: [Shift 


Postal Code . - Field format: |Popup Menu W 
Hire Date 


Job Description (_Add>> _J 
ac Employee Number Value list: [Shift Value List 
, 
Items visible: 1 Muttipte 


selections 


|Job Description 





To set options for the New Record page: 
1. Select a field in the Fields list. Then click the Add button. 


Note FileMaker container, calculation, summary, and related fields 
cannot be used to create a new record from the New Record page. 


2. To change the field label of a field, select the field in the Fields on New 
record page list and change the field label by typing over it in the Field 
label text box. 
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3. Specify the HTML format (radio buttons, check boxes, pop-up menu, 
text field, or text area) for the field in the Feld format pop-up menu. 


4. If you want to format the selected field as a pop-up menu, check 
boxes, or radio buttons, see step 6 on page 10-12 to use a value list 
defined in the FileMaker Pro database. 


5. Repeat steps 2 through 4 as appropriate for each field in your New 
Record page. 


6. Click Next. 
The Additional Pages panel appears. 


The Additional Pages panel appears and displays information about 
additional reply and error pages that the assistant creates based on the 
features and privileges you set in previous panels. Click Next, and then 
the Style panel appears. 


Setting style options for the FileMaker Pro form pages 


On the Style panel of the FileMaker Connection Assistant, you set the 
page background and text style of your FileMaker Pro form pages. 


The assistant provides a list of pre-made styles and displays an example 
of each one on the left side of the Style panel. You can change the text 
and background color of these styles and use your own GIF image for 
the background if you want. 


FileMaker Connection Assistant 


4 style defines the text color, link colors, and background for the 
‘Web page in your site. 
Which style do you want for your site? 


Plain 
Soft Lines 
Green Stripes 


Modern 
Gold 


Do you want to customize the 


selected style? 
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To set the basic page style for your FileMaker Pro form pages: 
1. Select a style in the Style scrolling list. 


2. Click Custom to enter custom values for the color of text and links as 
well as the color of the background. 


The Custom Style panel appears. 


3. Make your selections for text color and background in the Custom 
Style panel. 


= To use an image for the background, select Image in the 
Background area of the panel, and then select the image name 
from the pop-up menu. 


= To import an image, select Import Image in the Background area of 
the panel, and then click Browse to locate the image on your 
computer. 


4. Click Next to continue with the assistant. 


The Final hints and suggestions panel appears. Click Next, and the 
Location panel appears. 


Finishing up with the assistant 


The last step before finishing the FileMaker Connection Assistant is to 
specify a location and folder for the files. On the Location panel, click 
New Folder to create a new folder for your site; or click Existing Folder to 
specify the name and location of an existing folder that will contain your 
FileMaker Pro form pages. Then click Create to create the pages. 


SSS FileMaker Connection Assistant 


<< 
&e Location 


Click the New Folder button to create a folder for this Web site, or click the 
Existing Folder button to add the files to a folder on your computer. Please note, 
if you choose an existing folder, the assistant will overwrite any files of the 
same name that reside in that folder. 


New Folder... Existing Folder... 


Progress P= say 
(aunt Cancel [create _] 
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The FileMaker Connection Assistant creates the FileMaker Pro form 
pages based on the options you specified and inserts all the necessary 
CDML tags and links. Claris Home Page displays your site in the Site 
Editor, and opens the ReadMe file for the site you just created with the 
assistant. You can double-click the icon of any page in the Site Editor to 
open it and make changes. See “Using the Site Editor” on page 2-27 for 
information on using the Site Editor. 


Be sure to click the Consolidate button [334 on the Site Editor toolbar to 
copy the image files into the new site folder. 


The pages created by the FileMaker Connection Assistant are designed 
to be used right away without modification. For information on 
transferring your pages to a server, see “Copying your files to 
FileMaker Pro” on page 10-55 and “Testing the database in your site” 
on page 10-56 for information on testing the site. 


If you want to customize the appearance of the pages you created with 
the assistant, you can use the Claris Home Page editing tools to make 
changes. You can use the FileMaker Connection Libraries to edit and 
expand the database functionality of the site and to create new 
FileMaker Pro form pages as well. See the following sections “Editing 
FileMaker Pro form pages” and “Using the FileMaker Connection 
Libraries” for more information. 


Note Some of the CDML tags in the FileMaker Pro form pages that the 
assistant creates are required tags. It is better not to edit the required 
CDML tags in the pages the assistant creates. Changing a required 
CDML tag (such as the filename of the database the entire site depends 
on) in one file requires changing the database filename in other files that 
refer to it. See “Editing required CDML tags” on page 10-23 for more 
information. 


Editing FileMaker Pro form pages 


When you use Claris Home Page to create pages that connect to a 
FileMaker Pro database, you use CDML tags to specify FileMaker 
commands, actions, and database information. CDML tags are not 
HTML tags and are expressly used for specifying interactions with 
FileMaker Pro. 
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The CDML tags that appear on the pages created by the FileMaker 
Connection Assistant let your Web audience search, add, and modify 
records. When you create pages using the FileMaker Connection 
Libraries, you drag CDML tags from the libraries onto your pages. 


The CDML tags appear in Edit Page mode as objects identified by the 
FileMaker icon and the name of the CDML tag. (The CDML tag icons 
do not appear in the browser once your site is published.) 


Double-click a CDML tag to display its object editor and to edit 
attributes. Some CDML tags are not editable and are used to display 
links and database information supplied by FileMaker Pro (such as the 
number of records in a found set). 


To view details of all elements in a page as you work, switch views. You 
can then read comments and tag information. 


To view a detailed display in Edit Page mode: 


= Choose Display Mode from the View menu (Windows) or the 
Windows menu (Macintosh), and then choose Detailed from the 
submenu. 


Tip Print from this display mode to examine the tags on your pages more 
closely. 






@ FileMaker Form 













@ -Db @ -Format || @ -Error Q -Lay 
Guest Book.fp3 || gb_sum.htm || gb_err.htm || Form ¥iew 
Basic view in Edit Page mode Detailed view in Edit Page mode 


You can copy, paste, and move CDML tags the same way you do other 
Web page elements. See “Cutting, copying, and pasting” on page 2-7. 


Using the CDML tag object editors 


Claris Home Page provides object editors that are unique to each 
FileMaker form element. You use these object editors to specify the 
database, the layout, the action (if applicable), and various attributes for 
the element. 


To use a CDML tag object editor, do one of the following: 
= Double-click the CDML tag icon. 
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= Select the CDML tag icon and choose Object Editor from the View 
menu (Windows) or Show Object Editor from the Window menu 
(Macintosh). 


= Select the CDML tag icon and click the Object Editor button [Ej] on the 
toolbar. 


Editing required CDML tags 


Some of CDML tags used to specify certain database tasks or actions are 
required in some pages. Most of the required CDML tags are hidden tags 
that contain the name of the database, the name of the layout used to 
process a request, and other necessary information for executing the 
action or task. 





This tag Is used to specify the following information 
-Db The filename of the database your pages refer to. This is a hidden entry. 
-Lay The name of the layout being accessed in an edit, delete, or duplicate action. 


This is a hidden entry. 





-Format The filename of the page that confirms a record has been modified or that an 
action (such as editing, deleting, or duplicating records) has occurred. This 
is a hidden entry. 





-Error The filename of the page that is returned if an error occurs in processing the 
request to modify the database. This is a hidden entry. 





-New A button in the browser that is used by the audience to create a new record. 
Text on the button can be edited. 





-RecID The unique record identification of the current record so that it can be edited, 
deleted, or duplicated. This is a hidden entry. 





-Edit A button in the browser that is used by the audience to edit or update a 
record. Text on button can be edited. 


-Delete A button in the browser that is used by the audience to delete a record. Text 
on the button can be edited. 





-Dup A button in the browser that is used by the audience to duplicate a record. 
Text on the button can be edited. 





Editing CDML Code tags 


The CDML Code tag 


The CDML Code tag is used to represent a specific CDML tag whose 
value(s) come from a FileMaker Pro database file. The CDML Code 
tag is similar to the HTML Code tag (available from the Insert menu) 
which is used to specify actual HTML tags in your page. 
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In order to see the behavior of the CDML Code tag, the connection to 
the FileMaker Pro database must be active, and the page must be 
published in the browser. 

To edit a CDML Code tag: 

1. Double-click its icon and 

2. Type your changes in the scrolling area of the CDML Object Editor. 
3. Close the CDML Object Editor to apply your settings. 


Editing the CDML Code tag is similar to editing HTML. 





<Select name="field name here''> 
<option value="""> - No Selection - 
[FMP-ValueList: field name here, List=value list name here] 
<option [FMP-ValueListltem)>[FMP-ValueListltem][/FMP-¥alueList] 





CDML Code Tag Object Editor 


Using the FileMaker Connection Libraries 


The FileMaker Connection Libraries contain the CDML tags you need 
to create a site that connects to a FileMaker Pro database. There are two 
FileMaker Connection Libraries that come with Claris Home Page: the 
FileMaker Form Library (FileMaker Form.hlb) and the FileMaker 
Reference Library (FileMaker Reference.hlb). 


To use a CDML tag from the FileMaker Connection Libraries: 


1. Drag it from the right side of the library window onto your page. 


2. Set the attributes for the tag by double-clicking it to display its object 
editor. 


3. Close the tag’s object editor to apply the setting. 





Connecting to a FileMaker Pro database 10-25 


Using the FileMaker Form Library 


In the FileMaker Form Library, CDML tags are grouped according to 
how they are used to build pages in the site that connects to a 
FileMaker Pro database. The CDML tag combinations contained in the 
library entries are used to accomplish the most common database 
actions, such as searching records and modifying the database (creating, 
editing, duplicating, or deleting records). Each library entry in the 
FileMaker Form Library features notes on the usage and syntax of 
CDML tags as well as the CDML tags themselves, which you can drag 
onto your pages. 


You can use the CDML tag combinations in the FileMaker Form 
Library to quickly build pages that give your Web audience access to a 
FileMaker Pro database. This library is best used to create an entire site 
and to learn the relationships between CDML tags. 


To open the library: 


= Choose FileMaker Form Library from the View menu (Windows) or 
Windows menu (Macintosh). 





filemaker_forms.._ ee 


_—_—=—————— 
[ss] 
Abeail Hy Using FileMaker 4.0 
ag = Rea RRE gS Tags in Claris Home 
0) SEARCH Page 
Search Page 
- Required tags 
- Specifying search criteria 
- Specifying sort order 
~ Result set options 
- Executing scripts 
Search Results Page 
- Displaying results 
- Navigating 
- Search information 
~ Statistics 
~ Search criteria 
Le 


Search Error Page 
- Exor handling 








Ao oC0 0005000 5\5\6 








On the left side of the library window, the name of the action appears in 
uppercase as the first level of the library entries. You can click on the 
action name (such as SEARCH or NEW RECORD) to read an overview of 
which pages are necessary for executing the action. 
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The names of the pages that pertain to the action (such as Search Page) 
appear as second-level entries on the left side of the library window. The 
third level entries (such as Required tags and Specifying search criteria) 
contain the groupings of CDML tags that pertain to a page. Click a third 
level library entry to display the CDML tags on the right side of the 
library window. 


Using the FileMaker Reference Library 
The FileMaker Reference Library lists CDML tags alphabetically. 
CDML tags can be dragged from this library onto your pages. 
To open the library: 


= Choose FileMaker Reference Library from the View menu (Windows) or 
Windows menu (Macintosh). 





filemaker_ret.. ee 





——a 
(ca) f= (E22) 


Using FileMaker 4.0 
0) -DB 


& 
a Dene E Tags in Claris Home 
©) -Dup Page 
©) -Edit 
©) -Enor 
©) FileMoker Form 
©) Field - Check Box 
© Field - Pop-up Menu 
©) Field - Radio Button 
£) Field - Text Area 
©) Field - Text Field 
©) -Find 
©) -FindAl 
© -FindAny 
©) [FMP-ClientAddress] fa 








Click a tag to see a short description. 
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Building the Index page 


The index page is used by your audience to start a session with your 
FileMaker Pro database—to either search the database or create new 
records in it. For example, in the index page (default.htm) created by the 
assistant, there is a link to the Search page (search.htm) and another link 
to the New Record page (new.htm). You can copy these links and paste 
them into other pages, so that a session with your FileMaker Pro 
database can be initiated from any page in your site. You can change the 
text of the hyperlinks for searching your database or adding new records. 


To create a link to any other page in your site that will take the Web 
viewer to another FileMaker form page in your site: 


1. Create a new blank page. 
2. Type the text for your link. 


3. Select the text, and then click the Link Editor button on the 
toolbar. 


4. In the URL text box, type your URL according to the following 
syntax, where the URL appears on a single line without spaces, and 
“databasename” is the filename of your database; “layoutname” is the 
name of your layout; and “otherpage.htm” is the name of the 
FileMaker form page you want to display when this link is clicked in 
the browser: 


FMP ro?—db=databasenameé—lay=layoutname&—format=other 
page. htm&-view 








This tag Is used to specify the following information 

-Db The filename of the database for your site 

-Lay The name of the layout used by the page you are linking to 
-Format The filename of the FileMaker form page you want to link to 
-View The action of displaying a format file or page in your site 


5. Close the Link Editor to apply your setting. 
6. Save the Index page. 
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Building the Search page 


In the Search page, your Web audience can either specify their own 
search criteria, submit a predefined search request that you specify, or 
submit a search request that is a combination of their own search criteria 
and a predefined request that you specify. 


If you want your audience to be able to specify their own search criteria, 
set up input elements on the Search page. If you define a search request 
in advance, your Web audience can just click a button to start a search. 
If you want to combine search criteria that is specified by your audience 
with search criteria that you specify, your page comprises both types of 
elements: CDML tags that specify your predefined search criteria, and 
input elements where your audience can specify their own search 
criteria. 


To build a Search page: 
1. Create a new blank page. 


2. Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 


The FileMaker Form library opens, listing the CDML tags logically, 
by action. 


3. In the SEARCH section of the library, click the Required tags entry 
under the Search Page entry. 


The required tags for a Search page appear on the right of the library 
window. 










4. Click the tag labeled FileMaker Form to highlight the entire group, then 
drag the selection to your Search page. 


5. In the same Required tags entry, choose at least one tag for submitting 
a search request. Drag one or all the tags into the FileMaker form area 
that contains the other required tags. 


a0 -Find QO -Findany 
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6. Specify the attributes for each required tag in the page. Double-click 
the icon to display the object editor. 


For this tag Specify the following information 








-Db The filename of the database your pages refer to. This is a hidden entry. 

-Lay The name of the layout being accessed in the search. This is a hidden 
entry. 

-Format The filename of the page that is returned as a response to the search 


request a request. This is a hidden entry. 


-Error The filename of the page that is returned if an error occurs in processing 
the search request. This is a hidden entry. 








-Find The text on the button used in the browser to submit a search request. 

-FindAll The text on the button used in the browser to find all records in your 
database. 

-FindAny The text on the button used in the browser to find any (random) record 


in your database. 





Adding fields to the Search page 


You can add fields and choose the format for how they will appear in the 
Search page. Drag items from the Search Fields section of the Specifying 
search criteria entry in the FileMaker Form Library. 


Note FileMaker container fields cannot be used to define a search 
request. 


To use input elements from the FileMaker Form Library: 
1. Open the FileMaker Form Library. 


2. In the Specifying search criteriaentry, choose the element you want, and 
drag it onto the FileMaker form area of your Search page. 


Drag this element 
to your page To use this format for the search field 


Text field A text field form element. See “Adding a text field” on page 9-6 
for more information. 





Pop-up menu A pop-up menu or scrolling list form element. 


Note Fields that you want to format as pop-up menus or scrolling 
lists must have values associated with them, either defined by you 
in Claris Home Page or defined in value lists in the FileMaker Pro 
database. For more information on defining values with Claris 
Home Page, see “Adding a pop-up menu or scrolling list’ on 
page 9-11. 
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Drag this element 
to your page To use this format for the search field 


Check box A check box form element. 


Note Fields that you want to format as check boxes must have 
values associated with them, either defined by you in Claris Home 
Page or defined in value lists in the FileMaker Pro database. For 
more information on defining values with Claris Home Page, see 
“Adding a check box” on page 9-10. 





Radio buttons A radio button form element. 


Note Fields that you want to format as radio buttons must have 
values associated with them, either defined by you in Claris Home 
Page or defined in value lists in the FileMaker Pro database. For 
more information on defining values with Claris Home Page, see 
“Adding a list of radio buttons” on page 9-8. 





Text area A text area form element. See “Adding a text area” on page 9-7 
for more information. 





Reset A button appearing in the browser. When clicked, this button 
resets all other input elements to their default values. See “Adding 
a reset button” on page 9-15. 





3. Double-click each form element to bring up its object editor, and then 
enter the field name to which it corresponds in the Name text box. 


4. Close the object editor to apply your settings. 


Using value lists from the FileMaker Pro database 


Some FileMaker fields in your database file might have a value list 
associated with them to facilitate data entry. Value lists from FileMaker 
can be used in your Search page. 


To use FileMaker Pro value lists for check boxes and radio buttons: 
1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, select the entry for Specifying 
search criteria. 


The search criteria tags appear on the right of the library window. 


3. In the Search Fields section of the library, choose an HTML input type 
(for example, choose Check Box), and then drag the element into the 
FileMaker form area of the Search page. 


@ FMP-¥alueList 
oO @ FMP-¥alueListltem 








8. 
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. Double-click the FMP-ValueList tag to display its object editor. Type 


the name of the field in the Field Name text box, and then type the 
name of the value list in the Value List text box. 


. Close the FMP-ValueList Tag Object Editor to apply the setting. 
. Double-click the check box element itself to display the Check Box 


Object Editor. 


. Type only the name of the field to which it corresponds in the Name 


text box. 


Close the Check Box Object Editor to apply the setting. 


Tip In the browser, the elements within the FMP-ValueList tag area 
(denoted by the box with the red border) repeat as many times as there 
are values in the value list. You can format the orientation of the 
elements in this tag, so that multiple values appear vertically in the 
browser by typing a carriage return character. Press Enter (or Shift-Enter 
for less white space between lines) on Windows; or press Return (or 
Shift-Return for less white space between lines) on Macintosh, 
immediately following the FMP-ValueListItem tag in the 
FMP-ValueList area. 


To use FileMaker value lists for pop-up menus: 


1. 
2. 


Open the FileMaker Form Library. 


In the SEARCH section of the library, select the entry for Specifying 
search criteria. 


The search criteria tags appear on the right of the library window. 


. In the Search Fields section, drag the CDML Code tag that appears in 


the Pop-up Menu section into the FileMaker form area of the Search 
page. 


. Double-click the CDML Code tag to edit the raw code. Without 


deleting quotation marks, change the words “field name here”’ to the 
field name, and then change “value list name here” to the name of the 
value list. 


. Close the CDML Code Tag Object Editor to apply the setting. 
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Specifying search criteria 

When making a search request in the FileMaker Pro database, your Web 
audience specifies their criteria in the fields on the Search page. Every 
field that is used for searching needs to have an associated rule or logic 
for how to search it. In addition, the entire find request must have a rule 
or logic for how it is processed in the FileMaker file. You can set up your 
Search form so that the logic for the search and fields is specified by 
your Web audience. You can also predefine the logic for both the fields 
and the search request itself, or combine logic that is specified by both 
you and your audience. 


To set the logical operator for a search request: 
1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, select the entry for Specifying 
search criteria. 


The search criteria tags appear on the right of the library window. 


3. For a fixed search request, drag the -LOp (logical operator) tag into 
the FileMaker form area in the Search page. 


4. Double-click the -LOp tag to display its object editor. 


5. Select AND for a search request that matches records to all the 
submitted search criteria exactly or select OR for a search request that 
matches records to at least one of the submitted search criteria. 


6. Close the -LOp Object Editor to apply the change. 


For a search request whose logic will be specified by the Web audience, 
drag the two -LOp tags denoted by radio buttons into the FileMaker 
form area in the Search page. 


@Q@ -LOp Match all words between fields (AND) 
©) -LOP | watch any words between fields (OR) 


To set the field comparison operator for each field in a search request: 
1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, select the entry for Specifying 
search criteria. 


The search criteria tags appear on the right of the library window. 
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3. For a search request where the field comparison operator is fixed, 
drag the -Op tag into the FileMaker form area in the Search page. 


The -Op tag should appear immediately before the field with which 


you associate it. 


[a-o| sss 


4. Double-click the -Op tag to display its object editor. 


5. Select a field comparison operator from the list. 


Choose this field 
comparison operator 


Equals 


Contains 


To show these search results to your Web audience 


Records that match the search criteria exactly 


Records that contain the character or string of characters 


specified in the search criteria 





Begins with 


Records that feature the character or string of characters 
featured in the search criteria at the beginning of a value 





Ends with 


Records with the character or string of characters featured in 
the search criteria at the end of a value 





Greater than 


Records with values greater than the search criteria 





Greater than or equals 


Records with values greater than or exactly equal to the 
search criteria values 





Less than 


Less than or equals 


Records with values less than the search criteria 


Records with values less than or exactly equal to the search 


criteria values 





Not equals 


All Records except those that match the search criteria 





6. Close the -Op Object Editor to apply the change. 


For a search request whose field comparison operators will be specified 
by the Web audience, drag the field comparison pop-up menu element 
from the Specifying search criteria section in the library into the FileMaker 
form area in the Search page. The field comparison operator should 
appear immediately before the field with which you associate it. 


es 9 | 
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Setting options for sorting the search results 


You can specify whether you want the results of your search to be sorted 
or not and whether the Web viewer initiates the sort. You can also 
predefine a sort order or combine a predefined sort order with choices 
for sort order your audience makes before submitting a search request. 


To specify the field that search results are sorted by: 
1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, select the entry for Specifying 
sort order. 


The tags for specifying sort order appear on the right of the library 
window. 


3. Drag the -SortField and -SortOrder tags into the FileMaker form area 
of the Search page. 


The -SortField tag must appear directly before the -SortOrder tag 
associated with it. 


@ -SortField || @ -SortOrder 


4. Double-click the -SortField tag to display its object editor, and then 
type the name of the sort field. 


5. Close the -SortField Object Editor to apply your change. 


6. Double-click the -SortOrder tag to display its object editor, and then 
choose the sort order. For a sort order based on a value list, choose 
Custom, and then type the name of the list in the Value List text box. 


7. Close the -SortOrder Object Editor to apply your change. 


To set up sorting options specified by your Web audience: 
1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, click the entry for Specifying 
sort order. 


The tags for specifying sort order appear on the right of the library 
window. 


3. In the Sort Field section, choose the CDML Code tag and drag it into 
the FileMaker form area of the Search page. 
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The purpose of this tag is to display a pop-up menu of all the fields in 
the layout you specified for the Search page. Your Web audience can 
choose the field to sort on from this list. 


. In the Sort Order section, choose the sort order element that appears in 


the Specified by user section. 


This element is a pop-up menu with sorting values (ascending, 
descending) already defined. 


. Drag the element so that it appears directly after the CDML Code tag 


(the sort field) in the FileMaker form area of the Search page. 


at 


Setting options for the search results 
You can set the maximum number of records displayed in the Search 
Results Page, or you can allow your Web audience to choose a 
maximum from a pop-up list you add to the Search page. 


To set the maximum number of records displayed in each Search 
Results page: 


1. 
2. 


6. 


Open the FileMaker Form Library. 


In the SEARCH section of the library, select the entry for Result 
set options. 


The tags for Search result options appear on the right of the library 
window. 


. Drag the -Max tag into the FileMaker form area of the Search page. 
. Double-click the -Max tag to display its object editor. 


. Type a number for the maximum number of records you want 


displayed in a Search Results page. 
Close the -Max Object Editor to apply your change. 


To allow your Web audience to determine the maximum number of 
records displayed in the Search Results page: 


Choose the pop-up list from the Result set options library entry. This 
element requires no modification to be used in the Search page. 
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Saving the Search page 
Once you have set up the fields and the options for searching and sorting, 
you can save and name the Search page. The name of the Search page 
should correspond to the filename used in all files that refer to it. For 
example, the Index page file named “index.htm” might refer to the 
Search page file called “search.htm.” 


Building the Search Results page 


The Search Results page displays the records that are found or matched 
according to the search request made in the Search page. There are two 
ways of displaying records in a found set: as a list or as a table. 


Formatting results 


The FMP-Record tag appears as an area that contains the fields for the 
records in the search results page. In the browser, this record area will 
repeat depending on the number of records found and the maximum 
number of records displayed per page. For information on setting the 
maximum number of records displayed per page, see “Setting options 
for the search results” on page 10-35. 


To format search results as a list: 
1. Create a new blank page. 


2. Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 


3. In the SEARCH section of the library, select the entry for Displaying 
results under the Search Results Page section. 


4. Drag the FMP-Record tag into your Search Results page. 








| @ FMP-Record | FMP-Record 


acer FMP-Field aera FMP-Field aoe te FMP- Field eet FMP-Field 
Fi acer Name aera Name aoe te rthdate Calculated eet 


FMP-Record tag shown in Detailed display mode 





5. Position the pointer so that it is within the FMP-Record area, and then 
copy and paste a FMP-Field tag for every field you want to appear in 
the area. 
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6. Double-click each FMP-Field tag to display its object editor, and then 
type the name of the field for each tag. 
7. Close the FMP-Field Tag Object Editor to apply your settings. 


8. Add text to the area to create field labels, if necessary. 


Tip In the browser, the elements within the FMP-Record tag area 
(denoted by the box with the red border) repeat as many times as there 
are records in a found set. You can format the orientation of the elements 
in this tag, so that multiple records appear vertically in the browser by 
typing a carriage return character. Press Enter (or Shift-Enter for less 
white space between lines) on Windows; or press Return (or Shift- 
Return for less white space between lines) on Macintosh, immediately 
following the last FMP-Field tag in the FMP-Record area. 


To format search results as a table: 
1. Create a new blank page. 


2. Open the FileMaker Form Library. 


3. In the SEARCH section of the library, select the entry for Displaying 
results under the Search Results Page section. 


4. Drag the table element from the library into the Search Results page. 


[ Field_Label | Field_Label 


@] FMP-Field @ FMP-Field 





The table displays two columns, each with a field and field label. The 
row in which the FMP-Field tags appear is identified by a red border. 


5. Type over the Field_Label text to replace it with the name of the field. 


6. To add more columns (to display fields), double-click the table 
border to display the Table Object Editor. 


7. Click the Table tab, and type a number in the Columns text box, or click 
Add Column. 


8. Copy and paste the FMP-Field tag so it appears in each additional 
column and within the red border. 


9. Double-click each FMP-Field tag to display its object editor, and then 
type the name of the field for each tag. 


10.Close the FMP-Field tag object editor to apply your settings. 





10-38 Claris Home Page User’s Guide 


You can set up any table you create with Claris Home Page to display 
results for your search. To do this: 


1. Double-click the table border to display the Table Object Editor. 


2. Click the FileMaker tab, and then select the Use as FileMaker results table 
check box. 


3. Type a number for the row where the FileMaker record information 
will end in the table in the End Repeating at row text box. 


The default is 1, but if you are using the first row to display field 
labels (field names), type the number 2. 


4. Type a number for the row where the FileMaker record information 
will begin in the table in the Start Repeating at row text box. 


The default is 1, but if you are using the first row to display field 
labels (field names), type the number 2. 


5. Close the Table Object Editor to apply your settings. 


For search results formatted as lists or tables, the maximum number of 
records displayed per page will vary based on options you set in the 
Search page. See “Setting options for the search results” on page 10-35 
for more information. 


Building navigational links and text 


Your Search Results page can contain tags for navigating to the next and 
previous pages of records in a found set as well as links to the Record 
Detail page, which shows one record per page. You can also include tags 
that provide information about the FileMaker Pro found set. 


Search: Results Q 


Displaying records 1 thm S of 19 records found. (5 records displayed). 
Sorted by field: unsorted 


First Name Employee & Department Hire Date Work Ext. Email 

Sonia 0 Marketing 10/21/88 x6789 slong @yourdomain.com 
6819 Operations S587 x7156 gakers@yourdomain.com 
123 Operations 5111196 x1111 jsmith@yourdomain. com 
6864 Engineering B78? x6784 skenwood@youndomain.com 
6849 Publishing 5111184 x5678 lrichlew@ yourdomain.com 


Hi next page of records. 





Search results shown in browser 
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To add navigational links to the previous and next range of records in a 

found set: 

1. Open the FileMaker Form Library. 

2. In the SEARCH section of the library, select the entry for Navigating 
under the Search Results Page section. 

3. Drag the FMP-LinkPrevious and FMP-LinkNext tags into your 
Search Results page. 


4. Place the insertion point so that it is within the FMP-LinkNext and 
FMP-Previous areas, and then type the text for the links. 


@ FMP-LinkPrevious 

Previous page of records in the found set 
@ FMP-LinkNext 

‘Next page of records in the found set 


To make the field data that is returned in the Search Results page into a 
link to the Record Details page for the record displayed: 


1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, select the entry for Navigating 
under the Search Results Page section. 


3. Drag the special FMP-Field tag in the Link to Record Detail section 
of the Displaying results library entry into the FMP-Record area. 

The special FMP-Field tag is denoted by a blue border in Edit Page 
mode to indicate that it is a link. 

If you are using a table to format the search results, drag the special 
FMP-Field tag into the appropriate table cell (any cell in a row or 
rows denoted by the red border). 

4. Double-click the special FMP-Field tag to display its object editor, 
and then, in the Field Name text box, type the name of the field that will 
be the link to the Record Detail page. 

5. Close the special FMP-Field Object Editor to apply your setting. 

6. With the FMP-Field tag selected, choose Link Editor from the View 
menu (Windows) or choose Show Link Editor from the Window menu 
(Macintosh). 

7. In the Link Editor, type the name of your record detail page in place 
of “record_detail.htm.” In place of “layout name here,” type the name 
of the layout used by the page you are linking to. 


8. Close the Link Editor to apply your setting. 
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Including search information and statistics 


You can include search information and database statistics in the Search 
Results page. Including search information is useful when testing the 
pages or to provide information to your Web audience. Tags for 
indicating the current action (find), current database, current layout, 
current format, and current maximum records per page are examples of 
information you can provide. 


To add search information and statistics to the Search Results page: 
1. Open the FileMaker Form Library. 


2. In the SEARCH section of the library, select the entry for Search 
information or Statistics under the Search Results Page section. 


3. Drag the tags you want to include in the Search Results page (for 
example, drag FMP-CurrentMax). 


4. Type the text you want next to the FMP-CurrentMax icon. 


The maximum number of records you specified to display on this page was @ FMP-CurrentMax i 


Saving the Search Results page 


When you save the Search Results page, the name should correspond to 
the filename used in all files that refer to it. In the case of the Search 
Results page, its filename is specified in the -Format tag of the Search 
page. For example, the Search page named “search.htm” might refer to 
the Search Results page called “search_results.htm.” See “Building the 
Search page” on page 10-28 for more information. 


Building the Record Detail page 


The Record Detail page displays a single record in an entire page. The 
Record Detail page can be read-only, or it can be editable. If the Record 
Detail page is editable, it’s the page where your Web audience can edit, 
delete, or duplicate records. 


To build a read-only Record Detail page: 


1. Create a new blank page. 


2. Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 





7. 
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. In the RECORD DETAIL (READ ONLY) section of the library, select the 


entry for Displaying record data. 


. Drag library elements into the Record Detail page. 


For this type of read-only data Drag this element 








Field values FMP-Field 

Images from FileMaker container The image element in the Field section of the 
fields library entry 

Repeating field values FMP-Repeating tag (containing the 


FMP-RepeatingItem tag) 





Portal FMP-Portal tag (containing the FMP-Field tag) 





. In your Record Detail page, double-click each CDML tag to display 


its object editor. 


. For each CDML tag, type the name of the field in the Field Name 


text box. 


For Portals, type the name of the relationship in the Relationship Name 
text box. For the FMP-Field contained in the FMP-Portal tag, type the 
name of the relationship and the field in the Field Name text box. 


Close the object editor to apply the settings. 


To build an editable Record Detail page: 


1. 
2. 
3. 


Create a new blank page. 
Open the FileMaker Form Library. 


Tn the RECORD DETAIL (EDITABLE) section of the library, select the 
entry for Required tags under the Detail page section. 


The required tags for the Record Detail page appear on the right of 
the library window. 


@ FileMaker Form 





. Click the tag labeled FileMaker Form to highlight the entire group, 


then drag the selection to your Record Detail page. 


The FileMaker form area appears in the Record Detail page as a box 
with a red border containing the required tags. 
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5. In the same Record Detail page required tags library entry, choose the 
tags for modifying the database. Drag one or all the tags into the 
FileMaker form area that contains the other required tags. 


QC -Edit 


6. Specify the attributes for each tag except the -RecID tag. 
Double-click an icon to display its object editor. 


For this tag 
-Db 


Specify the following information 


The filename of the database your pages refer to. This is a hidden 
entry. 





-Lay 


The name of the layout being accessed in an edit, delete, or duplicate 
action. This is a hidden entry. 





-Format 


The filename of the page that confirms that an action (editing, 
deleting, or duplicating records) has occurred. This is a hidden entry. 





-Error 


The filename of the page that is returned if an error occurs in 
processing the request to modify the database. This is a hidden entry. 





-Edit 


Text on the button in the browser which is used by the audience to 
edit or update a record. 





-Delete 


-Dup 


Text on the button in the browser which is used by the audience to 
delete a record. 


Text on the button in the browser which is used by the audience to 
duplicate a record. 





Note Though the -RecID has an editable attribute value, it is better 
not to change it, because it is set up in the FileMaker Form Library 
for use in the Record Detail page. 


Adding fields to an editable Record Detail page 


You can add and format fields in an editable Record Detail page. Drag 
items from the Displaying record data entry in the FileMaker Form Library 
to the Record Detail page. 


To use input elements from the FileMaker Form Library: 


1. Open the FileMaker Form Library. 
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2. In the Displaying record data library entry, choose the element you 
want, and drag it onto the Record Detail page. 


Drag this element 
to your page 


FMP-Field tag 


To use this format for fields in an 
editable Record Detail page 


Read-only text value of the field whose name you specify. 





Text field 


A text field form element. See “Adding a text field” on 
page 9-6 for more information. 





Pop-up menu 


A pop-up menu or scrolling list form element. 


Note Fields that you want to format as pop-up menus or 
scrolling lists must have values associated with them, either 
defined by you in Claris Home Page or defined in value lists in 
the FileMaker Pro database. For more information on defining 
values with Claris Home Page, see “Adding a pop-up menu or 
scrolling list” on page 9-11. 





Check box 


A check box form element. 


Note Fields that you want to format as check boxes must have 
values associated with them, either defined by you in Claris 
Home Page or defined in value lists in the FileMaker Pro 
database. For more information on defining values with Claris 
Home Page, see “Adding a check box” on page 9-10. 





Radio buttons 


A radio button form element. 


Note Fields that you want to format as radio buttons must have 
values associated with them, either defined by you in Claris 
Home Page or defined in value lists in the FileMaker Pro 
database. For more information on defining values with Claris 
Home Page, see “Adding a list of radio buttons” on page 9-8. 





Text area 


A text area form element. See “Adding a text area” on page 9-7 
for more information. 





FMP-Repeating tag 
(containing the 
FMP-RepeatingItem 
tag) 


Text values as they appear in a repeating field, where only the 
first repetition is editable. The HTML repeats for all the 
repetitions in the specified field. 





FMP-Portal tag 
(containing the 
FMP-Field tag) 


Text values as they appear in a portal, where only the first 
record is editable. The HTML repeats for each record in the 
portal. 





3. To specify the field names for each element, double-click the CDML 
Code tag to display the CDML object editor. 


4. Without deleting quotation marks, change the words “field name 
here” to the field name, and then change “value list name here” to the 
name of the FileMaker Pro value list. 


5. Close the CDML Code Tag Object Editor to apply the setting. 
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Adding an email reply option to an editable Record Detail page 


You can have FileMaker Pro send an email message notification to an 
address you specify whenever the database is modified. 


To add an email notification to an editable Record Detail page: 
1. Create a new blank page. 
2. Type the message of your email. 


3. Choose Save from the File menu. Type email_format as the title of 
your document. 


4. In the Save dialog box, choose FileMaker Include File in the Save as type 
list (Windows) or in the File type pop-up menu (Macintosh). 


5. Save the file to your site folder. Click Save. 
6. Open the FileMaker Form Library. 


7. In the RECORD DETAIL (EDITABLE) section of the library, select the 
E-Mail notification entry. 


The required tags for sending email appear on the right of the library 
window. 


fa Mail Tags 
 -MailTo Q -MailFrom 


@ -MailSub  - Mail Format 
] -MailHost 





8. Drag the entire group of tags into the FileMaker form area of your 
editable Record Detail page. 


9. Double-click each tag within the Mail Tags area to display its object 
editor and set the attributes for each tag. 


For this CDML tag Type the following as its attribute 


-Mailto The email address of the recipient. 





-MailFrom The email address of the sender. 





-MailSub The subject of the email. 
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For this CDML tag Type the following as its attribute 








-MailFormat The filename of the email format file. For example: 
email_format.txt. (This is the body of your email 
message.) 

-MailHost The address of the SMTP server host. For example, 
smtp.domain.com 

-MailCC (optional) The email address of the person who is carbon copied. 

-MailBCC (optional) The email address of the person who receives a blind carbon 
copy. 





Note A FileMaker form area can support only one set of mail tags. 


You can edit the email message later on (for example, to include field 
data). For information on how to do this, see the following section, 
“Changing the text of the email message reply file.” 


Saving the Record Detail page 
Once you have set up the Record Detail page the way you want, you can 
save it. The name of the Record Detail page should correspond to the 
filename used in all files that refer to it. For example, the Search Results 
page called “search_results.htm” might refer to a Record Detail page 
named “record_detail.htm.” 


Changing the text of the email message reply file 


You can edit the text of the email message used in reply files. Besides 
text, you can include CDML tags in the email text file. For example, 
including the FMP-Field tag in the email format file lets you include 
field values from the FileMaker file in the body of the email message. 


To add CDML tags to an email notification file: 


1. Open the file containing the body text of your email notification 
message. 

2. In the Claris Home Page dialog box, click the FileMaker Pro HTML 
Include File radio button, and then click OK. 

3. Type or edit the text of the message. 

4. Choose FileMaker Reference Library from the View menu (Windows) or 
the Window menu (Macintosh). 


5. Select the FMP-Field entry. 
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. Drag the FMP-Field tag into your email_format.txt file. Drag as many 


instances of this tag as necessary for displaying each field value that 
you want. 


7. Double-click each FMP-Field tag to display its object editor. 
8. Type the name of the field in the Feld Name text box. Do this for each 


FMP-Field tag. 


. Type supporting text next to the FMP-Field tag in the message. 


Record of type 4] FMP-Field | 15 been added to the database. 
The record count is now: @ FMP-CurrentRecordCount 


10.Save the email message file. 


Building the Record Detail Reply page 


If you have given database modification privileges to your Web 
audience, they see a confirmation page in the browser after they modify 
the database. Use the Record Detail Reply page to create the message, 
provide information about the current action executed, and provide links 
to other pages in your site. For information on creating links and 
anchors, see chapter 7, “Creating links and anchors.” 


To provide the Web audience with information about the current action 
(for example, edit, delete, duplicate) executed: 


1. 
2. 


Create a new blank page. 


Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 


. In the RECORD DETAIL (EDITABLE) section of the library, select the 


entry for General information, under the Detail Reply Page section. 


. Drag the tags (for example, drag FMP-CurrentRecordCount) you 


want to include in the Record Detail Reply page. 


. Type supporting text next to the FMP-CurrentRecordCount icon. 


The database has been modified. The record count is now : LS@_FMP=CurrentRecordCount | 
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6. Save your page. 
The name of the Record Detail Reply page should correspond to the 
filename used in all files that refer to it. For example, the Record 
Detail page might have “record_detail.htm” as the filename, and the 
Record Detail Reply page might have “record_detail_reply.htm” as 
its filename. 


Building the New Record page 


If you have given record creation privileges to Web viewers, they can 
add a record to the database you publish on the Web. The New Record 
page contains input elements, which set up the fields for your Web 
audience to fill in and create a new record. 


To build a New Record page: 
1. Create a new blank page. 


2. Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 

3. In the NEW RECORD section of the library, select the entry for 
Required tags. 


The required tags for the New Record page appear on the right of the 
library window. 


@ FileMaker Form 





QC -New 


4. Click the tag labeled FileMaker Form to highlight the entire group, then 
drag the entire selection to your New Record page. 


The FileMaker form area appears in the New Record page as a box 
with red borders containing the required tags. 
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5. Specify the attributes for each required tag. Double-click the icon to 
display the object editor. 


For this tag 


-Db 


Specify the following information 


The filename of the database your pages refer to. This is a hidden 
entry. 





-Lay 


The name of the layout being accessed to perform a new record action. 
This is a hidden entry. 





-Format 


The filename of the page that is returned as a confirmation that a 
record has been added. This is a hidden entry. 





-Error 


The filename of the page that is returned if an error occurs in 
processing the new record request. This is a hidden entry. 





-New 


Text on the button in the browser which is used by the audience to 
create a new record. 





Adding fields and data entry options 


You can add fields to the New Record page and choose the format for 
the fields as they will appear in the New Record page. 


To use input elements from the FileMaker Form Library: 
1. Open the FileMaker Form Library. 
2. In the NEW RECORD section, select the Data Entry library entry. 


3. Choose the element you want, and drag it onto the FileMaker form 
area of your New Record page. 


Drag this element 


to your page 


Text field 


To use this format for the fields in a New Record page 


A text field form element. See “Adding a text field” on page 9-6 
for more information. 





Pop-up menu 


A pop-up menu or scrolling list form element. 


Note Fields that you want to format as pop-up menus or scrolling 
lists must have values associated with them, either defined by you 
in Claris Home Page or defined in value lists in the FileMaker Pro 
database. For more information on defining values with Claris 
Home Page, see “Adding a pop-up menu or scrolling list” on 
page 9-11. 





Check box 


A check box form element. 


Note Fields that you want to format as check boxes must have 
values associated with them, either defined by you in Claris Home 
Page or defined in value lists in the FileMaker Pro database. For 
more information on defining values with Claris Home Page, see 
“Adding a check box” on page 9-10. 








4. 


5. 
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Drag this element 
to your page To use this format for the fields in a New Record page 


Radio buttons A radio button form element. 


Note Fields that you want to format as radio buttons must have 
values associated with them, either defined by you in Claris Home 
Page or defined in value lists in the FileMaker Pro database. For 
more information on defining values with Claris Home Page, see 
“Adding a list of radio buttons” on page 9-8. 





Text area A text area form element. See “‘Adding a text area” on page 9-7 
for more information. 





Reset A button appearing in the browser. When clicked, this button 
resets all other input elements to their default values. See “Adding 
a reset button” on page 9-15. 





Double-click each form element to bring up its object editor, and then 
type the field name to which it corresponds in the Name text box. 


Close the object editor to apply your settings. 


See also “Using value lists from the FileMaker Pro database” on 
page 10-30 for information on using fields with FileMaker value lists in 
the New Record page. 


Adding an email 


reply option to a New Record page 


You can have FileMaker Pro send an email message notification to an 
address that you specify whenever a record is added to the database. 


To add an email notification or reply to a New Record page: 


1. 
2. 


Create a new blank page. 


Type the message of your email. This is the body of your email 
message. 


Choose Save from the File menu. Type email_format as the title of 
your document. 


In the Save dialog box, choose FileMaker Include File in the Save as type 
list (Windows) or in the File type pop-up menu (Macintosh). 


5. Save the file to your site folder. Click Save. 
6. Open the FileMaker Form Library. 


Tn the NEW RECORD section of the library, select the E Mail notification 
entry. 


The required tags for sending email appear on the right of the library 
window. 
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ff Mail Tags 
] -MailTo @ -MailFrom 


] -MailSub Q -Mail Format 
@ -MailHost 





8. Drag the entire group of tags into the FileMaker form area of your 
New Record page. 


9. Double-click each tag within the Mail Tags area to display its object 
editor and set the attributes for each tag. 











For this CDML tag Type the following as its parameter 

-Mailto The email address of the recipient. 

-MailFrom The email address of the sender. 

-MailSub The subject of the email. 

-MailFormat The filename of the email format file. For example: 


email format .txt. 











-MailHost The address of the SMTP server host. 
-MailCC (optional) The email address of the person who is carbon copied. 
-MailBCC (optional) The email address of the person who receives a a blind 


carbon copy. 





Note A FileMaker form area can support only one set of mail tags. 


You can edit the email message later on (for example, to include field 
data). For information on how to do this, please see, “Changing the text 
of the email message reply file” on page 10-45. 


Saving the New Record page 


Once you have set up the New Record page the way you want, you can 
save it. The name of the New Record page should correspond to the 
filename used in all files that refer to it. For example, the Index page 
might have filename “index.htm,” and it may refer to the New Record 
page filename, “new_record.htm.” 
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Building the New Record Reply page 


The New Record Reply page is the confirmation page that is presented 
to the Web audience after they have added a record. You can create the 
message in this page (for example, “Thank you. You have successfully 
created a new record.”’) in this page as well as provide links back to other 
pages in your site using the Claris Home Page editing tools. 


To provide the Web audience with information about adding a new 
record: 


1. Create a new blank page. 


2. Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 


3. In the NEW RECORD section of the library, select the entry for 
Displaying record data under the New Reply Page section. 


4. Drag the tags (for example, drag FMP-Field) you want to include in 
the New Record Reply page. 


5. Type supporting text next to the FMP-Field icon. 


Record of type “_FMP-Field | 1.45 been added to the database. 


6. Save your New Record reply page. 


The name of the New Record Reply page should correspond to the 
filename used in all files that refer to it. For example, the New Record 
page might have filename “new_record.htm,” and it may refer to the 
New Record Reply page filename, “new_record_reply.htm.” 


Building the error pages 
You can create the following error pages based on the actions and 
privileges you set for your Web audience: 


= a Search Error page for errors that occur while processing a search 
request. 

= aRecord Detail Error page for errors that occur while processing a 
request to edit, delete, or duplicate records. 


= a New Record Error page for errors that occur while processing a 
request to create a new record. 
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Displaying error information 


To display error information generated by FileMaker Pro: 


1. 
2. 


Handling errors 


Create a new blank page. 


Choose FileMaker Form Library from the View menu (Windows) or the 
Window menu (Macintosh). 


. Select the entry for the error page you want: 


= Error handling in the Search Error Page section 
= Error handling in the Detail Error Page section 
= Error handling in the New Error Page section 


. Select the FMP-CurrentError tag, and then drag the tag to your Error 


page. 


. Type supporting text in the error page. For example, “An error of type 


FMP-CurrentError occurred.” 


. Save and name the error page as it corresponds to the action. 


The names of the error pages must correspond with the filenames 
used in the form pages where the action is initiated, and as specified 
by the -Error tag. For example, the Search page might have the 
filename, “search.htm”’ and it may refer to the error page, 
“search_error.htm.” 


You can use the FMP-If tag to handle errors and display error messages 
conditionally. This can be useful for providing meaningful feedback to 
your Web audience when an error occurs. 


To handle errors conditionally: 


1. 
2. 
3. 


Open the error file you want to edit. 

Open the FileMaker Form Library. 

Select the entry for the error page you want: 

= Error handling in the Search Error Page section 
= Error handling in the Detail Error Page section 
= Error handling in the New Error Page section 


. Select the FMP-If tag, and then drag it onto your error page. 


5. Double-click the FMP-If tag to display its object editor. 
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6. Type the condition for the error tag in the Condition text box. Use the 
following syntax (in this case, the example pertains to a search error 
where zero records are found): 
currenterror.eq.401 

7. Close the FMP-If tag object editor to apply the setting. 


8. Place the insertion point so that it is inside the FMP-If tag area, and 
then type the message that will display when the condition is met. 


The FMP-If area can contain CDML tags. 
9. Save and name the error page as it corresponds to an action. 


The names of the error pages must correspond with the filenames 
used in the form pages where the action is initiated and as specified 
by the -Error tag. For example, the New Record page might have the 
filename, “new_record.htm” and its error page might be 
“new_record_error.htm.” 


This example tests for error number 401, which corresponds to zero 
records found. See the FileMaker Pro error code numbers in the 
FileMaker Pro online Help topic “Status(CurrentError) function” for 
possible results. See the following section for a list of comparison 
operators, such as .eq. 


To add to this example and test for additional errors: 


=» Add an FMP-If tag for every additional test. 


Alternatively, you can use the FMP-If/FMP-Else tags to display a message 
if the condition is true and another message if the condition is false. 


@ FMP-If 
@ FMP-If 
2 




















© Required information is missing. 


Please retum and complete all fields marked a3 “required". 








‘Q FMP-Else 


e Error adding record 


Please recheck your submission and try again. 











FMP-IF and FMP-Else in Detailed Display Mode 
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Displaying content conditionally 


You can use the FMP-If and FMP-Else tags to display HTML in a page 
conditionally. A useful application of this feature is for displaying 
messages in reply and error pages. 


There are reserved words or codes that can be used to specify a 
condition. The comparison operators that can be used are indicated in 

















the following table. 

This comparison operator Indicates 

.eq. Equals 

-neq. Not equals 

.gt. Greater than 

.gte. Greater than or equal to 

lt. Less than 

Ite. Less than or equal to 

cn. Contains 

nen. Does not contain 
Using a True/ False condition 


A true/false or Boolean expression can be used to test a condition. The 
comparison operators that can be used for a true/false condition are 
equals (.eq.) and not equals (.neq.). For example, to test if the database 


is sorted, you can use this syntax in specifying the condition in an 
FMP-If tag: 


IsSorted.eq.False 


Using a numeric comparison condition 


Use the following codes or reserved words to test numbers or specific 
error numbers or numeric information or statistics on the current state of 
the FileMaker Pro database. You can use all comparison operators 
except for contains (.cn.) and does not contain (.ncn.). 


This number Indicated by this code Can be used as in this example 
Current error number CurrentError CurrentError.eq.509 





Records in found set CurrentFoundCount CurrentFoundCount.gte.100 
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This number Indicated by this code Can be used as in this example 


Current maximum number CurrentMax CurrentMax.Ite.50 
of records on a page 





Current records in CurrentRecordCount CurrentRecordCount.gt. 1000 
database 





Current record number CurrentRecordNumber CurrentRecordNumber.gt.500 





Current number of CurrentSkip CurrentSkip.1t.20 
records skipped at the 
beginning of a range 








Record number of the last RangeEnd RangeEnd.neq.20 
record in a range 

Number of records shown RangeSize RangeSize.eq.40 
in range 

Record number of first RangeStart RangeStart.eq. 1 


record in range 





Using a text comparison condition 


When using a text comparison condition, all comparison operators are 
allowed. As a general rule, any CDML tag that returns alphanumeric 
characters can be used in a text comparison condition. Use only the 
name of the tag to specify a condition. For example: 


CurrentDate.gte.10/10/96 
ClientPassword.eq.password_name 


Fieldname.cn.literal_value 


Copying your files to FileMaker Pro 


Before copying your files to FileMaker Pro, it’s a good idea to open your 
site folder in the Site Editor and perform media consolidation and 
verification of links and references. See chapter 12, “Uploading your 
pages to a Web server” for information on how to do this. 


You can copy your site folder to the FileMaker Pro host computer using 
your network software to mount the server volume and copy your files 
onto it. Copy the contents of your site folder into the Web folder, which 
is located in the FileMaker Pro application folder. 


See the FileMaker Pro documentation for more information. 
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Testing the database in your site 


As you develop your site, it’s a good idea to look at your pages from the 
point of view of your Web audience, using a browser. Using the same 
computer, you can edit your pages in Claris Home Page, and then run 
FileMaker Pro and your browser software to view the results. Ideally, 
you would run all three applications at once and make modifications as 


you go. 


To test your site on the same computer or on a computer on your 
network: 


1. Copy the contents of your site folder to the Web folder in the 
FileMaker Pro application folder on your computer or on a computer 
on your network. 


2. Start FileMaker Pro, and then open your database file. 


3. If necessary, set options to enable the FileMaker Pro Web 
Companion and to share the database file. 


Select the Web Companion plug-in in Application Preferences and 
choose Sharing from the File menu. Configure the Web Companion 
User Interface to the home page of your site, or the default.htm page. 


4. Start your browser. 


5. Type the following URL as the location, where “IP_address” is the IP 
address of the computer that is running FileMaker Pro. 


http: //IP_address/ 
6. Press Enter. 


Your home page or index page (default.htm) appears in the browser. 
You can test the links to go to a search or add records page, submit a 
request, and then view the results both in the browser and in the 
FileMaker file. 


As you edit files in Claris Home Page, you can save them to the Web 
folder, and then click Reload in the browser. It is recommended that you 
set the options for clearing the disk cache in your browser, so that only 
the most recent versions of your files are displayed in the browser as you 
save and re-save your pages. 


Chapter 11: Adding multimedia to your Web page 





Multimedia includes not only JPEG and GIF images, but movies, sound, 
animation, and objects that allow people to interact with your Web page. 
It offers you a way to make your Web page more appealing to your 
audience. With Claris Home Page, you can quickly add Quicktime 
movies, Java applets, and other types of multimedia to your Web page 
to make it stand out and draw your audience in. 


Some types of multimedia, such as QuickTime movies, require external 
helper applications on your audience’s machines in order to view or hear 
them. In addition, their browsers require specific plug-in applications to 
be able to recognize and display the multimedia. 


You can use Claris Home Page to provide an alternative message for 
your viewers who can’t see your multimedia and a way for them to 
download the necessary helper application or browser plug-in. 


Adding multimedia that rely on browser plug-ins 


Web browser plug-ins are small applications that extend the capabilities 
of the browser to read your files in a specific way. Plug-ins make it 
possible for browsers to support more than HTML, JPEG, or GIF files 
on the Web. They tell the browser to open files in a specific application 
on your computer. For example, a QuickTime plug-in tells the browser 
to open any files that have the QuickTime extensions .mov or .snm in the 
QuickTime application on your computer. 


With Claris Home Page, you can insert multimedia and specify 
parameters or change its attributes in the Plug-in Object Editor. 


Inserting multimedia into your page 


When you insert multimedia into your Web page, Claris Home Page 
creates a reference link to the multimedia file and displays an icon that 
represents the file in Edit Page mode. To view or hear the actual media, 
use Preview in Browser mode. 


To insert multimedia that requires a browser plug-in: 


1. Place the insertion point in the page where you want the multimedia 
to appear and choose Plug-in from the Insert menu. 
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A message appears warning you to not select an actual plug-in, but 
the multimedia file for it instead. 





MID acs 





Please select a data file, such as a 
QuickTime movie or Shockwave file, for 
use by a Netscape plugin. Do not 
select the plugin itself. 


CD Never show this warning again 





2. Click OK. 
3. In the Open dialog box, select the multimedia file and click Open. 


An icon representing the multimedia file appears on your Web page. 


Opening the Plug-in Object Editor 
Once you have inserted a multimedia file into your page, you can use the 
Plug-in Object Editor to change the location of the file, specify the width 
and height of the multimedia display, and provide a URL that has a plug- 
in available for downloading. 











Plug-in | 

















100 | [Fixets (ie) 
100 | [Pixels 
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Parameters | Extended 


Location: Browse... 
width: [100 


Height: [100 


Plug-in Page: 


























To open the Plug-in Object Editor, do one of the following: 


= Double-click the multimedia icon. 


= Click the multimedia icon, and choose Object Editor from the View 
menu (Windows) or Show Object Editor from the Window menu 


(Macintosh). 
= Click the multimedia icon, and click the Object Editor button E]| on the 
toolbar. 


To apply the new settings, press Tab or click the close box of the Plug- 
in Object Editor. 


Setting multimedia options 
In the Plug-in Object Editor, you can set Claris Home Page to: 
= specify a new path to where the multimedia file is located 
= change the width and height of how the multimedia is displayed 


= specify a link to a required plug-in for your viewers to download if 
they don’t have the plug-in installed in their browsers 


To update the path to where a multimedia file is located: 


1. Select the multimedia icon in your Web page and open the Plug-in 
Object Editor. 


2. In the Location text box, type a new path or click Browse to locate the 
multimedia file and enter a new path. 


Note When you click Browse, a message appears warning you to not 
select an actual plug-in, but the multimedia file for it instead. Click OK. 





11-4 Claris Home Page User’s Guide 


te 
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To change the display size of the multimedia using the Plug-in Object 
Editor: 


1. Select the multimedia icon in your page and open the Plug-in Object 
Editor. 


2. Choose Pixels or Percent and type a new size in the Width and Height 
text boxes. 


= Choose Pixels to make the size a fixed amount that is not affected 
by the browser window’s size. 


= Choose Percent to make the size a percentage of the browser 
window’s size. 


Tip Press Tab to apply a new setting without closing the object editor. 
3. Close the object editor to apply your changes. 


To change the display size using the mouse: 
1. Select the multimedia icon. 
2. Drag one of the handles to change the size. 
= Drag the bottom handle to change the height. 
= Drag the right-side handle to change the width of the plug-in. 


= Drag the lower-right corner handle to change the width and height 
at the same time. 


To specify a link to a required plug-in: 


1. Select the multimedia icon in your page and open the Plug-in Object 
Editor. 


2. Type the URL for the appropriate plug-in page in the Plug-in Page text 
box. 


When your audience cannot see the multimedia on your page because 
the required plug-in is missing from their systems, their browsers 
display a message similar to this: 


“This page contains information of type “xxxx’” that can only be 
viewed with the appropriate plug-in. What do you want to do?” 


If they click the Plug-in Info button to get the plug-in, the plug-in page 
that you specified in the Plug-in Object Editor appears. Clicking Cancel 
closes the message. 
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Adding extra HTML to the multimedia element 


You can add your own HTML directly to the plug-in element using the 
Plug-in Object Editor. 


Note This is an advanced feature that requires knowledge of HTML; it 
specifies additional parameters for the <EMBED> tag. 


To add extra HTML, double-click the plug-in icon to open the Plug-in 
Object Editor. Click the Extended tab and type the HTML in the Extra 
HTML Attributes text box. The HTML that you type is added to the 
<EMBED> tag. 


Adding a QuickTime movie to your Web page 


You can add a QuickTime movie to your Web page and set it to 
automatically play when a browser downloads the page or include a 
movie controller allowing your audience to start the movie when they 
want. 


Your audience must have the appropriate QuickTime plug-in 
application for their browsers as well as a QuickTime movie player on 
their computers in order to view the movie. When you insert a 
QuickTime movie into your Web page, Claris Home Page automatically 
inserts a link to the QuickTime Web site where these applications are 
available for downloading. If your viewers do not have these 
applications on their computers, they will see a dialog box where they 
can activate this link. 


QuickTime movies must have the extension .mov or .snm for a Web 
browser to recognize them. In addition, if you create a QuickTime movie 
ona Macintosh, you must “flatten” the movie (remove the resource fork) 
so that it can play on all platforms. Flattening is not necessary for movies 
created in QuickTime for Windows. A flattening tool is available at the 
QuickTime Web site. 


Note You must preview your page in a Web browser for the movie 
to run. 


Inserting the QuickTime movie 


When you insert a movie into your Web page, Claris Home Page 
displays a movie icon in your Web page while in Edit Page mode. To 
view the actual movie, you use Preview in Browser mode. 
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To insert a QuickTime movie into your Web page: 


1. Place the insertion point in the page where you want the movie to 
appear and choose QuickTime Movie from the Insert menu. 


2. In the Open dialog box, select the QuickTime movie file (it must have 
the .mov or .snm extension) and click Open. 


If you have QuickTime installed, a movie icon appears on your 
Web page. 


Opening the QuickTime Object Editor 


Once you insert the QuickTime movie into your Web page, you use the 
QuickTime Movie Object Editor to set the play options, and change 
other attributes of the movie, such as the width and height. You can also 
use the QuickTime Movie Object Editor to add your own HTML to the 
movie element. 


[T_T 
[i fess: 3) ose 

fo 

No a 


http://quicktime. apple.com | 








Location: [___] 
width: 
Loop: CD Auto-play 
Controller: 
Plugin Page: 











To open the QuickTime Movie Object Editor, do one of the following: 
= Double-click the movie icon. 


= Select the movie icon, and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu 
(Macintosh). 
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Select the movie icon, and click the Object Editor button IE! on the 
toolbar. 


To apply the new settings, press Tab or click the close box of the 
QuickTime Movie Object Editor. 


Setting the movie play options 
In the QuickTime Movie Object Editor, you can set Claris Home Page to 


automatically play the movie when the page is downloaded 


play the movie continuously, repeating it until you close the page or 
stop it using the movie controller 


display a movie controller so someone viewing the movie can make 
it stop 


To make the movie play automatically when the page is downloaded: 


1. 


Select the movie icon in your page and open the QuickTime Movie 
Object Editor. 


. Click the Parameters tab and select No from the Loop pop-up menu. 
. Click the Auto-play check box. 
. Apply your changes by closing the QuickTime Movie Object Editor. 


To make the movie play continuously: 


1. 


3. 
4. 


Select the movie icon in your page and open the QuickTime Movie 
Object Editor. 


. Click the Parameters tab and choose Yes from the Loop pop-up menu 


if you want it to play forward continuously. Choose Auto-Reverse 
from the Loop pop-up menu if you want it to play forward and then 
backward in a continuous loop. 


Click the Auto-play box. 
Close the object editor to apply your changes. 


Changing the size of the movie window 


You can use the QuickTime Movie Object Editor to change the size of 
the movie as it’s displayed in the page. You can also use the mouse to 
change the width and height of the movie. 





11-8 Claris Home Page User’s Guide 


To change the size using the QuickTime Movie Object Editor: 


1. Select the movie icon in your page and open the QuickTime Movie 
Object Editor. 


2. Click the Parameters tab and type a new size in the Width and Height 
text boxes. 


3. Choose Percent to make the size a percentage of the browser 
window’s size. Choose Pixels to make the size a fixed amount that is 
not affected by the browser window’s size. 


Tip Press Tab to apply a new setting without closing the object editor. 
4. Close the object editor to apply your changes. 


To change the size using the mouse: 


Select the movie icon and drag the bottom handle to change the height 
of the movie, drag the right-side handle to change the width of the 
movie, or drag the lower-right comer handle to change the width and 
height at the same time. 


To change the size back to its original setting, click the Original Size 
button in the QuickTime Movie Object Editor. 


Testing the QuickTime movie 


To test the movie, you need to preview it in a browser. You also need to 
test it on the same machine that has the Movie Player or QuickTime 
application. 


To preview the QuickTime movie: 


= Hold the mouse button down on the Preview in Browser button on the 
toolbar and choose a browser from the pop-up menu. 


Adding extra HTML to the movie element 
You can add your own additional HTML directly to the movie element 
using the QuickTime Movie Object Editor. 


Note This is an advanced feature that requires knowledge of HTML; it 
specifies additional parameters for the <EMBED> tag. 
To add extra HTML to the movie element: 


1. Double-click the movie icon to open the QuickTime Movie Object 
Editor. 
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2. Click the Extended tab and type the HTML in the Extra HTML Attributes 
text box. 


The HTML that you type is added to the <EMBED> tag. 


Adding a Java applet to your Web page 


You can use Claris Home Page to add Java applets, small applications 
written in the Java programming language, to your Web page. Java 
applets offer an endless possibility of special effects that can be as 
simple as making an image dynamic or as complex as monitoring real- 
time data from a browser. Applets can be downloaded from a Web 
server and run on most computers. 


Many Java applets are available for free, or as shareware on the Web, for 
you to customize and use in your Web pages if you don’t want to create 
them yourself. Claris Home Page 3.0 comes with some sample applet 
files you can modify or use as they are. 


To view and interact with a Java applet, you need a “Java-enabled” Web 
browser, such as Netscape Navigator 3.0. You must preview your page 
in the browser for the applet to run. 


Inserting the Java applet 
When linking to a Java applet, you create a link to a .class file. This 
.class file may then reference other files, which need to be in the same 
directory (Windows) or folder (Macintosh). For more information about 
a specific Java applet, refer to the readme file or documentation included 
with the Java applet. 


To insert a Java applet into a Web page: 


1. Place the insertion point in the page where you want the applet to 
appear and choose Applet from the Insert menu. 


2. In the Open dialog box, select the main applet class file (it must have 
the .cls or .class extension) and click Open. 


An icon representing the applet appears on your Web page. 
Note If you did a complete install from the Claris Home Page CD-ROM 


disc, sample applets are located in the Contents folder in the Claris 
Home Page 3.0 folder. 
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Opening the Applet Object Editor 


Once you’ ve inserted the applet, you use the Applet Object Editor to 
specify the parameters of the applet. 
































Location: [id 
ait taper: | —___] 


Alignment: 
Width: Pixels HSpace: [0 ‘| 
Height: Pixels ¥Space: fo 





To open the Applet Object Editor, do one of the following: 
= Double-click the applet icon. 
= Select the applet icon, and choose Object Editor from the View menu 


(Windows) or Show Object Editor from the Window menu 
(Macintosh). 


= Select the applet icon, and click the Object Editor button |B on the 
toolbar. 


To apply any new settings you make in the Applet Object Editor, press 
Tab or click the close box of the Applet Object Editor. 
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Specifying the applet’s parameters 
Some applets are designed to be customized. For example, a ticker tape 
applet allows you to specify a value for the text parameter that scrolls 
your words across the screen. You can specify applet parameters and 
their values in the Applet Object Editor. 


To specify a parameter for an applet: 


1. Select the applet icon in your page and open the Applet Object Editor. 
2. Click the Parameters tab. 
3. Click Add. 


A parameter is added to the list with the default name, New Parameter, 
appearing in the Name column. 


4. Click in the Name column of the new parameter. 


5. Select the words New Parameter, and type the name of the parameter 
you wish to add. 


6. Click in the Value column of the new parameter and type the value of 
the parameter you are adding. 


To delete a parameter, select the parameter in the list and click the 
Remove button. 


Macintosh: Click Restore All to clear the settings and reset all Name/ 
Value pairs to their original names. 


To apply your changes, press Tab or click the close box of the Applet 
Object Editor. 


Specifying the applet’s size, alignment, and margins 


You can use the Applet Object Editor to change the width or height of 
the applet, realign the applet in relation to text on the page, or set the 
amount of white space around the applet. 


To apply your changes, press Tab or click the close box of the Applet 
Object Editor. 


To change the height or width of the applet: 

1. Click the applet icon and open the Applet Object Editor. 
2. Click the Content tab if not already selected. 

3. Type a new size in the Width and Height text boxes. 
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To change the alignment of the applet in relation to text on the page: 
1. Click the applet icon and open the Applet Object Editor. 

2. Click the Content tab if not already selected. 

3. Select an alignment type from the Alignment pop-up menu. 








Choose this option To do this 

Top Align the top of the applet with the top of the text next to 
It. 

Middle Align the middle of the applet with the text next to it. 

Bottom Align the bottom of the applet with the bottom of the text 
next to it. 

Left or Right Place the applet on the left or right side of the page and 


have text flow around it. 





To set the amount of space around the applet: 

1. Click the applet icon and open the Applet Object Editor. 

2. Click the Content tab if not already selected. 

3. Type a number from 0 to 100 in the HSpace and VSpace text boxes. 


Adding extra HTML to the applet element 


You can add your own additional HTML directly to the applet element 
using the Applet Object Editor. 


Note This is an advanced feature that requires knowledge of HTML; it 
specifies additional parameters for the <APPLET> tag. 


To add extra HTML to an applet: 


1. Double-click the applet icon to open the Applet Object Editor. 


2. Click the Extended tab and type the HTML in the Extra HTML Attributes 
text box. 


The HTML that you type is added to the <APPLET> tag. 


To specify an alternate HTML tag that is used by browsers when the 
other tag is unsupported: 


1. Double-click the applet icon to open the Applet Object Editor. 


2. Click the Extended tab and type the alternate HTML in the Alternate 
HTML text box. 
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The HTML that you type is added to the <APPLET> tag. 


Changing the name or location reference to the applet 


When you insert an applet into your Web page, the applet name and 
location—the path to the folder where the applet is located—appears in 
the Applet Object Editor. You can change the name and location to refer 
to a different applet. Claris Home Page updates the reference to the new 
applet file. 


To change the name or location of the applet: 
1. Click the applet icon and open the Applet Object Editor. 


2. Click the Content tab. 


3. In the Name and Location text boxes, type a new name and path for the 
applet file, or click the Browse button to find and select the applet file. 


4. Close the Applet Object Editor to apply your changes. 


To have two applets on the same page find and communicate with each 
other, you need to specify an instance name for both of them. 

To specify the applet instance name: 

1. Click the applet icon and open the Applet Object Editor. 

2. Click the Extended tab. 

3. In the Instance Name text box, type a name for the applet file. 

4 


. Repeat these steps for the other applet, giving it the same name in the 
Instance Name text box. 


5. Close the Applet Object Editor to apply your changes. 


Providing an altemative message 
You can provide an alternative message to appear instead of the applet 
whenever a page containing applets is viewed with a browser that does 
not support applets. 
To provide an alternative message: 
1. Click the applet icon and open the Applet Object Editor. 
2. Click the Content tab. 
3. In the Alt Label text box, type a message. 
4. Close the Applet Object Editor to apply your changes. 


Chapter 12: Uploading your pages to a Web server 





Once you have built your Web pages on your computer, you can use 
Claris Home Page to make them available to everyone on the World 
Wide Web or to share them with other users who have access to the same 
server. 


Claris Home Page makes the task of transferring or uploading your files 
to the Web easy when you use the Site Editor. You can upload a page or 
an entire site including any referenced files in a single step. You can also 
upload open pages as you’re working on them in Edit Page mode. 


Claris Home Page helps you prepare your site for uploading and 
provides several ways to upload the files, update your Web site, and 
download files from your Web site. 


Claris Home Page uploads and downloads files using FTP (File Transfer 
Protocol) and requires a network connection that supports it. You can 
have a direct connection or a connection via a modem to the Internet. 
You can also publish your site on an intranet, a network that uses 
Internet technology but is not public. 


Preparing to upload the site 


Before you upload your pages to the Web, use the Site Editor to do a 
final check on all the files in your site. To prepare for uploading your 
site, you can use the Site Editor to: 


= check the estimated download times of all the pages in your site 
= verify that all links and references in your pages are not broken 
= consolidate all referenced images and multimedia files 


= identify the location where files will be uploaded 


To use the Site Editor: 
1. Choose Open Folder as Site from the File menu. 


The Browse for Folder dialog box (Windows) or the Select a Folder 
dialog box (Macintosh) appears. 


2. In the dialog box, navigate to your site folder. 
3. Click OK (Windows) or Select “folder name” (Macintosh). 
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All the files in your site folder appear in the Site Editor. The Site 
Editor also displays the name of your site and the total number and 
size of your Web pages. 


Note When you open your site in the Site Editor, Claris Home Page 
creates a site definition file in your site folder called 
“site_definition.wst.” (The .wst extension stands for “Web site.’’) 
Claris Home Page uses this file to store your site settings. 





. 12004M _ 12:00AM 1/1/04 

2) CAFE_ART.HLB 2KB «5:04PM 1_ 8:20PM 8/25/97 
RR CAFEHOME.HTM 4KB 5:05PM 1_ 4:56PM 8/28/97 
Ba CAFETOC.HTM 707 byt_ 5:04PM 1_ 5:12PM 8/21/97 
fa FRAMEPG.HTM 773 byt_ 5:05PM 1_ 3:07PM 8/20/97 
ff IMAGES : 12004M _ 12:00AM 1/1/04 
fi PRODUCTS.HTM 2KB 5:05PM 1_ 5:26PM 8/6/97 
fi QUESTION.HTM 2KB 5:05PM 1_ 9:33PM 8/29/97 

SITE_D~1.WST 746 byt_ 5:05PM 1_ 4:31PM 7/28/97 




















Site Editor - Coffee site SH 


OD Go eS) 


Local Site Folder: DataDisc:Claris Home Page 3.0:tutorial-Coffs 
FTP Upload Location: 





CQ Coffee site - Sun, Jay 
cafe_art.hlb 2KB Sun, Al 
BR cafehome.ntm 4KB  Sun,J 
BR cafetoc.ntm 707 b... Tue, A 
BR framepg.htm 773 b... Tue,A 
> Q images - Sun, J 
BR products.ntm 2KB Sun, J 
BR question.ntm 2KB Sun, J 
R site_definition.wst 746 b... Sun, J 
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Checking the document statistics 


You can use the Site Editor to check the document statistics for your 
entire site. Claris Home Page gives an approximate estimate of the 
downloading time for individual pages in your Web site or for your 
entire site. 


To check the statistics for pages in your site: 


1. In the Site Editor, select the files you wish to check, or if you want to 
check the entire site, select nothing. 


2. Click the Statistics button [ij] on the toolbar. 
The Statistics dialog box appears. 





Miele 








Statistics 


HTML Pages: 1 
Total Size: 4042 


Approximate Download Times 








3. Click the Selection tab to view the statistics for the selection. 
4. Click Done to close the Statistics window. 
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Consolidating media files 


You can use Claris Home Page to consolidate all the media files, 
including images, sounds, movies, etc., referenced by your Web pages 
within your site, so they will be uploaded when you upload your site to 
a Web server. You can consolidate them in your site folder or in a folder 
that’s separate from the pages and other associated files in your site. If 
you have a lot of images in your Web pages, this can help you keep them 
organized and ensure that the reference links to the images won’t be 
broken when you upload your pages to the Web. 


When you consolidate your media files, Claris Home Page creates a 
folder (named “Media” by default) or uses one that you specify to hold 
the image and media files. Claris Home Page checks all references to the 
image and media files made by the pages in your site folder. If a file is 
not in the folder you specified, Claris Home Page makes a copy of the 
file and places it there. The reference link in the Web page is changed to 
reflect the new location. When you consolidate again, any new images 
or media are added to the folder. 


Note The media consolidation feature does not detect media files that 
are referenced within Java source code, as may be the case with multi- 
file Java applets. Media files referenced in this manner do not get 
consolidated. 


To consolidate media files in your Web site: 

1. Open the Site Editor by choosing Open Folder as Site from the File 
menu, selecting your site folder, and clicking OK (Windows) or Select 
“folder name” (Macintosh). 


2. Select the files you wish to consolidate, or select the site folder to 
consolidate media for the entire site. 


3. Click the Consolidate button |§4 on the Site Editor toolbar. 


If you select items in the Site Editor before clicking the Consolidate 
button, the Consolidate dialog box appears. Click Selected Files/Folders 
or Entire Site, and then click OK. 
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4. In the Consolidate dialog box, specify where you want to consolidate 
the media files by choosing an option from the Consolidate media files 
pop-up menu. 


Choose this option To specify this 


At the same level as the Images or media that are featured in a page are copied to the 
HTML file same folder where the page that features them is located. 





In a one media folder for All images or media that are featured in your Web site are 
your site copied to a single folder that you specify in the Media Folder 
Name text box (see step 4). 





In a separate media folder Images or media that are featured in a page that’s in a 

for every folder in your site subfolder to the site folder are copied to a separate media 
subfolder. Claris Home Page creates a media subfolder for 
every folder in the site using the same media folder name 
that you entered in the Media Folder Name text box (see step 4). 





5. If you want your media files consolidated in a separate folder(s) from 
the rest of your site files, type the name of your media folder in the 
Media Folder name text box. 


By default, Claris Home Page consolidates media files in a folder 
called “Images.” If the folder doesn’t exist, Claris Home Page creates 
a folder using the name in the Media Folder Name text box. 


Claris Home Page uses this folder whenever you consolidate media 
for this site until you change it in this dialog box. If later you open an 
individual page from this site folder and click the Consolidate button 
on the Basic toolbar (rather than on the Site Editor toolbar), Claris 
Home Page automatically consolidates all media to this folder. 


6. Click Consolidate. 


Claris Home Page checks the reference links in each page you 
selected and consolidates all the referenced media files into the folder 
you specified. If the media file is not already in this folder, Claris 
Home Page makes a copy of it and places it there. 


Note A warning dialog box may appear if a referenced file in your site 
cannot be located. You can click OK to locate the file, click Skip file 
to leave the link unchanged, or click Cancel to end the consolidation 
process and return to the Site Editor to examine your pages. 
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Cee) x] 


Unable to locate the file referenced as "images/cup_bag. gif” from 
“CAFETOC.HTM". Please locate it. 


























A Unable to locate the file referenced as 


“images/hazelnut.gif” from “cafehome.htm”. Please 
locate it. 








To consolidate images in a page you’re working on: 
= In Edit Page mode, click the Consolidate button on the Basic toolbar. 


Claris Home Page consolidates all image and media files referenced 
in the page to the default media folder you specified. If the media 
folder you specify does not exist, Claris Home Page creates it in the 
same folder that contains the page you’re working on. 


Verifying links and references 


You can use the Site Editor to check for broken links in your Web pages. 
Claris Home Page verifies links to pages, anchors on pages, and 
references to image files or other associated files in your site. Claris 
Home Page does not verify links to external Web sites or files on a 
volume of a computer that is not networked to your computer. You can 
also verify links and references in a page you’ re working on in Edit Page 
mode. 


For information about creating links to pages or anchors on a page, see 
Chapter 7, “Creating links and anchors.” References to image files or 
other media files are automatically created when you insert an image or 
media file into your Web page. For more information, see chapter 4, 
“Adding images to your Web page” and chapter 11, “Adding 
multimedia to your Web page.” 


To verify links in your Web site: 


1. Open the Site Editor by choosing Open Folder As Site from the File 
menu, selecting your site folder, and clicking OK (Windows) or Select 
“folder name” (Macintosh). 


2. In the Site Editor, select the pages you want to check. If you want to 
verify the links of the entire site, select all files. 
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3. Click the Verify Links and References button |] on the Site Editor toolbar. 


If you selected something in the Site Editor before you clicked this 
button, the Please Select dialog box appears. Click Selected Files/ 
Folders or Entire Site and click OK. 


Claris Home Page verifies the links and references in your site. If 
there are any broken links, Claris Home Page displays the Verify 
dialog box for each broken link it finds. 





Cao EA 
Broken Link or Reference: [_ Shange | 
imagesicup_bag.gif 

Change All 
Remove Tag 


Skip 


Browse Files... Cancel 



































Broken Link or Reference: Change 
images /hazelnut.gif 


Change All 


jemove Ta: 





Change to: 
image: 





Skip 


7 ri 
Browse Files. Cancel 

















This dialog box displays the path for the broken link and also enters 
it automatically in the Change to text box. 


4. Type the new path for the links destination in the Change to text box 
or click Browse to locate the missing file. 


5. For each broken link that Claris Home Page finds, do one of the 
following: 


= Click Change to fix the link as specified in the Change to text box 
and continue checking for other broken links. 


= Click Change All to fix all links to the same file as specified in the 
Change to text box and continue checking for other broken links. 


= Click Skip to not make changes to a broken link and continue 
checking for other broken links. 


= Click Remove Tag to remove the HTML tag containing the broken 
link or reference. 


= Click Cancel to close the Please Change dialog box. 
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To verify links in an open page you’re working on: 


1. In Edit Page mode, click the Verify Links and References button [J on 
the Basic toolbar. 


Claris Home Page checks all the links in the page and if it finds a 
broken link, the Verify dialog box appears. 


2. Type the new path for the link’s destination in the Change to text box 
or click Browse to locate and enter the new path. 


3. For each broken link that Claris Home Page finds, do one of the 
following: 


= Click Change to fix the link as specified in the Change to text box 
and continue checking for other broken links. 


= Click Change All to fix all links to the same file as specified in the 
Change to text box and continue checking for other broken links. 


= Click Skip to not make changes to a broken link and continue 
checking for other broken links. 


= Click Remove Tag to remove the HTML tag containing the broken 
link or reference. 


= Click Cancel to close the Please Change dialog box. 


Specifying the Web server account 


You only need to specify the destination of your Web site once in Claris 
Home Page before you upload your files. You can set specifications for 
your Web server account and use it when you upload or download a file. 
Claris Home Page saves the account settings for each individual site. 
You can set Claris Home Page to upload files to accounts with Netcom, 
Earthlink, another Internet service provider, America Online, or to a 
specific intranet account. 


The Web server you upload your files to must support passive or active 
FTP (File Transfer Protocol). Your Internet service provider, 
Webmaster, or system administrator will give you the server name (your 
Web site domain), the names of the folder(s) where you can upload your 
files to, the name of your account, and a password for your account. You 
will probably also receive guidelines for naming files, such as how to 
name the home page file of your site (typically named “index.htm’’). 
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To specify the Web server account: 


1. Open the Site Editor by choosing Open Folder as Site from the File 
menu, selecting your site folder, and clicking OK (Windows) or Select 
“folder name” (Macintosh). 


2. Click the Upload button |%a) on the Site Editor toolbar. 
The Upload dialog box appears. 
3. Click Set FTP Options. 
The FTP Options dialog box appears. 
4. Choose your service provider from the Service Provider pop-up menu. 


5. Fill out or customize the FTP server settings, as appropriate. 


Choose this setting To specify this 


Server Name The domain name of the remote server, for example, 
any_server.com . 





User Name The name of your account. 





Password The password for your account. Select the Save Password 
check box to have Claris Home Page remember it. 





Remote Folder The name of the folder on the remote server where your site 
files reside. If you’ ve specified the account information, and 
you’re connected to the server, you can click Browse to look 
for the remote folder and enter its name for this setting. 





FTP Mode Use Passive or Active mode for transferring files. Claris Home 
Page uses Passive mode by default. Choose Active from the 
pop-up menu if you’re using a Macintosh Internet Config 
Setup that’s active. 





6. Click OK to close the FTP Options dialog box. 


Claris Home Page saves your account settings for the site in the site 
definition file. 


7. To close the Upload dialog box without uploading, click Cancel. 


Uploading to the Web server 


You can use Claris Home Page to upload selected files or your entire 
Web site to a server at once. You can also upload an open page that 
you’re working on and any associated images, movies or other content 
files that the page references. 
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Uploading an entire site 
Use the Site Editor to upload the entire contents of your site folder. 


To upload your entire site: 


1. Open the Site Editor by choosing Open Folder as Site from the File 
menu, selecting your site folder, and clicking OK (Windows) or Select 


“folder name” (Macintosh). 
2. Click the Upload button |%a) on the Site Editor toolbar. 


The Upload dialog box appears. 





CAs 





©) Selected files and folders in the Site Editor Window 
© Only those files that have changed since the last upload 
@ Entire Site 
Upload Location 
Server Name: 
Remote Folder: 








3. Select Entire Site in the dialog box. 
4. Click Upload. 





Uploading your pages toa Web server 12-11 


Note If the Upload button is dimmed, your FTP settings may be 
incomplete or currently unspecified. Click Set FTP Options to display 
the FTP Options dialog box, and specify your FTP settings for your 
Web server account. See “Specifying the Web server account” on 
page 12-8 for more information. 


Claris Home Page displays a progress bar while your files upload. 


To stop uploading, press the Esc key (Windows) or 9-period 
(Macintosh). 


Uploading selected files 


You can use the Site Editor to upload individual files in your site, 
including your pages and Web associated images, movies, or other 
content files that the pages reference. You can also upload an open Web 
page and its associated files while viewing it in Edit Page mode by 
clicking the Upload button [fal 


To upload individual files in the Site Editor: 


1. Open the Site Editor by choosing Open Folder as Site from the File 
menu, selecting your site folder, and clicking OK (Windows) or Select 
“folder name” (Macintosh). 


2. In the Site Editor, select the files or folders you want to upload. 
3. Click the Upload button |%i| on the toolbar. 
The Upload dialog box appears. 
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Upload 

@ Selected files and folders in the Site Editor Window 
© Only those files that have changed since the last upload 
© Entire Site 


Upload Location 
Server Name: 


Remote Folder: 


Set FTP Options... 


(Concer) (upre0a) 








4. Click Upload and enter FTP account settings, if needed. 


Note If the Upload button is dimmed, your FTP settings may be 
incomplete or currently unspecified. Click Set FTP Options to display 
the FTP Options dialog box, and specify your FTP settings for your 
Web server account. See “Specifying the Web server account” on 
page 12-8 for more information. 


Claris Home Page displays a progress bar while your files upload. 


To stop uploading, press the Esc key (Windows) or 9-period 
(Macintosh). 
Uploading an open Web page 


You can upload individual pages that are open in Claris Home Page. 


To upload an open Web page: 


1. Choose Remote from the File menu, and then choose Upload from the 
submenu, or click the Upload button [9] on the Basic toolbar. 


An Upload dialog box for the page appears. 





CMTE 
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Upload 








Upload 
Page: cafehome.htm 
[El Include image files 





r— Upload Location 
Server Name: 


Remote Folder: 








Set FTP Options... 





(Concer) (opreoa) 








. Select the Include image files check box if you want to upload images 


or other files referenced by the page. 


. Click Upload. 


. Enter your password, if necessary, and click OK. 


Claris Home Page displays a progress bar while your page uploads. 


Updating your Web site 


You can maintain your Web site by downloading old or out-of-date files, 
uploading new or changed files to the server, and deleting old files from 
the server, if necessary. When you download a file, Claris Home Page 
copies the file onto your hard drive, and a copy of the file remains on the 
Web server. You can delete this file from the server if you want. 


Uploading only files that have changed 


To upload only the pages or files that are new or have been changed: 


1. 


Open the Site Editor by choosing Open Folder as Site from the File 
menu, selecting your site folder, and clicking OK (Windows) or Select 
“folder name” (Macintosh). 


. Click the Upload button [a1 on the Site Editor tool bar to display the 


Upload dialog box. 


. Select Only those files that have changed since the last upload. 
. Click Set FTP Options if you need to enter or change the FTP account. 


settings and click OK. 


. Click Upload. 


Claris Home Page displays a progress bar while your files upload. 


To stop uploading, press the Esc key (Windows) or &-period 
(Macintosh). 





12-14 Claris Home Page User’s Guide 


Downloading files from the Web 


You can use Claris Home Page to download files from your Web site or 
remote server. When you download a file, Claris Home Page makes a 
copy of the file and places it on your computer. You can also use Claris 
Home Page to browse the contents of your site folder on the Web and 
delete files from it. 


To download your files from a remote server: 


1. Choose Remote from the File menu and then choose Download from 
the submenu. 


The Download dialog box appears. 


| PADRErEr] 























Download From 
Server Name: 


File/Folder to download: / 


Change Download Options... 


Download to location 
Location: DataDisc:Claris Home Page 3.0-:tutorial:Coffee site: 


(tancet_} (Gowntoad} 








2. If you want to change the server name, the name of the folder that 
contains your files on the server, or other FTP settings, click Change 
Download Options, make your changes, and click OK. See “Specifying 
the Web server account” on page 12-8 for more information on FTP 
settings. 


3. Click Browse to choose a location where you want to download the 
files to. 


4. Select a volume or folder and click OK. 
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5. Click Download. 


When you download a single file, a copy of the file is saved onto your 
hard disk. The name of this copy is the same as the original, which 
remains on the Web server. 


Deleting files from the Web server 


You can delete a file or entire subfolder from your site on the 
Web server. 


To delete a file from your site folder on the server: 


1. Choose Remote from the File menu, and then choose Download from 
the submenu. 


The Download dialog box appears. 
2. Click Change Download Options, and specify your FTP settings. 
3. In the download Options dialog box, click Browse. 


The Browse dialog box appears, showing the list of files on the 
FTP server. 


4. Locate and select the file you wish to delete. 
5. Click Delete. 


Claris Home Page deletes the file from the server. 


Appendix A: Codes for special characters 





The following is a list of the International Standards Organization (ISO) 
Latin-1 characters and their corresponding numeric entities. How to use 
these special characters in your Web pages is described in chapter 3, 
“Adding text to your Web page” (see page 3-8). 


Note If a browser does not recognize a numeric entity, then the 
characters listed in brackets appear in its place. 


Numeric entity 

































































(raw HTML option) Special character produced 
&#O0;-&#08; Unused 

&#O09; Horizontal tab 
&#10; Line feed 
&#11;-&#12; Unused 

&#13; Carriage Return 
&#14;-&#31; Unused 

&#32; Space 

&#33; ! (Exclamation mark) 
&H34; " (Quotation mark) 
&H35; # (Number sign) 
&H#36; $ (Dollar sign) 
&H37; % (Percent sign) 
&H38; & (Ampersand) 
&#39; ' (Apostrophe) 
&H#A40; ( (Left parenthesis) 
&#HA1; ) (Right parenthesis) 
&H#HA2; * (Asterisk) 

&HA3; + (Plus sign) 

&H#44; , (Comma) 

&#AS; - (Hyphen) 

&#A46; . (Period) 

&#AT; / (Solidus - slash) 





&#A8:—&H#57; 0123456789 (Digits 0-9) 
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Numeric entity 
(raw HTML option) 


Special character produced 





















































HSB; : (Colon) 

&H#59; ; (Semi-colon) 

&#O0; < (Less than) 

&#61; = (Equals sign) 

&#O62; > (Greater than) 

&H#63; ? (Question mark) 

&H#O4; @ (Commercial at) 

&#O5;—&#90; ABCDEFGHIJKLMNOPQRSTUVWXY 
Z (Letters A-Z) 

&H#9O1; [ (Left square bracket) 

&H#O2; \ (Reverse solidus - backslash) 

&HO3; ] (Right square bracket) 

&H#94; ‘ (Caret) 

&HOS; _ (Horizontal bar - underbar) 

&#96; * (Grave accent - back apostrophe) 

&#97;—&#122; abcdefghijklmnopqrstuvwxyz (Letters a-z) 

&#123; { (Left curly brace) 

&H124; | (Vertical bar) 

&#125; } (Right curly brace) 

&#126; ~ (Tilde) 

&H#127;-&#159; Unused 





Values 128-159 


These values are not assigned to displayable characters in 
the ISO8859-1 code and should not be used for 
displayable characters in HTML. 


























&#160; Non-breaking space [&nbsp] 

&#I61; j (Inverted exclamation) [&iexcl; &iexcl] 
&#162; ¢ (Cent sign) [&cent; &cent] 

&#163; £ (Pound sterling) [&pound; &pound] 
&#164; x (General currency sign) [&curren; &curren] 
&#165; ¥ (Yen sign) [&yen; &yen] 

&#166; | (Broken vertical bar) [&brvbar; &brvbar] 
&#167; § (Section sign) [&sect; &sect] 








Numeric entity 
(raw HTML option) 


Codes for special characters A-3 


Special character produced 



















































































&H#168; * (Umlaut - dieresis) [&uml; &uml] 

&#169; © (Copyright) [&copy; ©] 

&#170; * (Feminine ordinal) [&ordf; &ordf] 

&#171; « (Left angle quote, guillemotleft) [&laquo; &laquo] 

&#172; = (Not sign) [&not; &not] 

&#173; — (Soft hyphen) [&shy; &shy] 
Many browsers do not properly handle this character. It is 
better to use the &shy; entity name instead of this ISO 
numeric entity. 

&#174; ® (Registered trademark) [&reg; ®] 

&#175; ~(Macron accent) [&macr; &macr] 

&#176; ° (Degree sign) [&deg; &deg] 

&#HIT77; + (Plus or minus) [&plusmn; &plusmn] 

&#178; ? (Superscript two) [&sup2; &sup2] 

&#179; ° (Superscript three) [&sup3; &sup3] 

&#180; * (Acute accent) [&acute; &acute] 

&HIB81; ut (Micro sign) [&micro; &micro] 

&#182; J (Paragraph sign) [&para; &para] 

&#183; - (Middle dot) [&middot; &middot] 

&H184; , (Cedilla) [&cedil; &cedil] 

&#185; * (Superscript one) [&sup1; &sup1] 

&#186; ° (Masculine ordinal) [&ordm; &ordm] 

&#187; » (Right angle quote, guillemotright) [&raquo; &raquo] 

&HI1B88; 44 (Fraction one-fourth) [&frac14; &frac14] 

&H#189; % (Fraction one-half) [&frac12; &frac12] 

&#190; % (Fraction three-fourths) [&frac34; &frac34] 

&#191; { (Inverted question mark) [&iquest; &iquest] 

&H#192; A (Capital A, grave accent) [&Agrave; A] 

&#193; A (Capital A, acute accent) [&Aacute; A] 

&#194; A (Capital A, circumflex accent) [&Acire; A] 

&#195; A (Capital A, tilde) [&Atilde; A] 

&#196; A (Capital A, dieresis or umlaut mark) [&Auml; A] 
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Numeric entity 
(raw HTML option) 


Special character produced 






























































&#197; A (Capital A, ring) [&Aring; A] 

&H#198; ~ (Capital AE dipthong, ligature) [&AElig; 4] 
&#199; ¢€ (Capital C, cedilla) [&Ccedil; €] 

&#200; E (Capital E, grave accent) [&Egrave; E] 

&#201; E (Capital E, acute accent) [&Eacute; E] 

&#202; E (Capital E, circumflex accent) [&Ecirc; EF] 
&#203; E (Capital E, dieresis or umlaut mark) [&Euml; E] 
&#204; I (Capital I, grave accent) [&Igrave; ql 

&#205; ik (Capital I, acute accent) [&Iacute; q 

&#206; i (Capital I, circumflex accent) [&Icirc; i] 
&#207; I (Capital I, dieresis or umlaut mark) [&Iuml; T] 
&#208; D (Capital Eth, Icelandic) [&ETH; <] 

&#209; N (Capital N, tilde) [&Ntilde; N] 

&#210; O (Capital O, grave accent) [&Ograve; 0} 
&#211; 0 (Capital O, acute accent) [&Oacute; fe) | 
&H#212; 0 (Capital O, circumflex accent) [&Ocire; 0] 
&#213; O (Capital O, tilde accent) [&Otilde; O] 

&#214; O (Capital O, dieresis or umlaut mark) [&Ouml; O] 
&#215; x (Multiply sign) [&times; &times] 

&H#216; © (Capital O, slash) [&Oslash; ©] 

&#217; U (Capital U, grave accent) [&Ugrave; Ul] 
&#218; U (Capital U, acute accent) [&Uacute; Ul 
&H#219; U (Capital U, circumflex accent) [&Ucire; Ul 
&#220; U (Capital U, dieresis or umlaut mark) [&Uuml; U] 
&#221; Y (Capital Y, acute accent) [& Yacute; +] 
&#222; B (Capital THORN, Icelandic) [&THORN; fi] 
&#223; 8 (Small sharp s, German, sz ligature) [&szlig; 8] 
&H224; a (Small a, grave accent) [&agrave; a] 

&#225; 4 (Small a, acute accent) [&aacute; 4] 

&#226; 4 (Small a, circumflex accent) [&acirc; 4] 
&H227; 4 (Small a, tilde accent) [&atilde; 4] 








Numeric entity 
(raw HTML option) 


Codes for special characters A-5 


Special character produced 
























































&#228; a (Small a, dieresis or umlaut mark) [&auml; a] 
&#229; a (Small a, ring) [&aring; a] 

&#230; z (Small ae dipthong, ligature) [&aelig; «] 
&#231; ¢ (Small c, cedilla) [&ccedil; ¢] 

&#232; é (Small e, grave accent) [&egrave; é] 

&#233; é (Small e, acute accent) [&eacute; é] 

&H#234; é (Small e, circumflex accent) [&ecirc; é] 
&H#235; é (Small e, dieresis or umlaut mark) [&euml; é] 
&H#236; i (Small i, grave accent) [&igrave; i] 

&H#237; i (Small i, acute accent) [&iacute; f] 

&H#238; 7 (Small i, circumflex accent) [&icirc; f] 
&#239; i (Small i, dieresis or umlaut mark) [&iuml; i] 
&#240; 6 (Small eth, Icelandic) [&eth; >] 

&H241; fi (Small n, tilde) [&ntilde; fi] 

&H#242; 6 (Small 0, grave accent) [&ograve; 6] 

&H#243; 6 (Small 0, acute accent) [&oacute; 6] 

&H#244; 6 (Small 0, circumflex accent) [&ocirc; 6] 
&H245; 6 (Small o, tilde) [&otilde; 6] 

&#246; 6 (Small 0, dieresis or umlaut mark) [&ouml; 6] 
&#247; + (Division sign) [&divide; &divide] 

&#248; ¢ (Small o, slash) [&oslash; 9] 

&#249; u (Small u, grave accent) [&ugrave; t] 

&#250; t (Small u, acute accent) [&uacute; tu] 

&#251; G (Small u, circumflex accent) [&ucirc; fi] 
&#252; ii (Small u, dieresis or umlaut mark) [&uuml; ii] 
&#253; ¥ (Small y, acute accent) [&yacute; +] 

&H#254; bP (Small thorn, Icelandic) [&thorn; fl] 

&H#255; y (Small y, dieresis or umlaut mark) [&yuml; y] 





Appendix B: Shortcuts for using Claris Home Page 





General shortcuts 


To do this 


Insert a horizontal rule. 


Use this shortcut on a PC with Windows 





Drag the Insert Horizontal Rule button E] from the 
Basic toolbar to the position where you want to 
insert the rule. 


Use this shortcut on the Macintosh 


Drag the Insert Horizontal Rule button E] from the 
Basic toolbar to the position where you want to 
insert the rule. 





Insert a table. 


Drag the Insert Table button |] from the Basic 
toolbar to the position where you want to insert 
the table. 


Drag the Insert Table button [J from the Basic 
toolbar to the position where you want to insert 
the table. 





Move a window without 
bringing it to the front. 


Not available. 


#8 -click on the window's title bar and then 
drag it. 





Open an object editor for a form 
element. 


Right-click the form element (such as a check 
box or radio button) and choose Form Object 
Editor from the context menu. 


Control-click the form element (such as a check 
box or radio button) and choose Form Object 
Editor from the context menu. 





Open the Frame Object Editor. 


Right-click the frame and choose Show Object 
Editor from the context menu. 


Control-click the frame and choose Show Object 
Editor from the context menu. 





Switch to Edit HTML Source 
mode. 


Press Shift-Ctrl-H. 


Press Shift-9-H. 





Switch to Edit Page mode. 


Press Shift-Ctrl-E. 


Press Shift-36-E. 





Switch to Preview Page mode. 


Move the insertion point to the 
next or previous setting in a 
dialog box or object editor or to 
the next or previous cell in a 
table. 


Press Shift-Ctrl-P. 


Press Tab to move forward or Shift-Tab to back. 


Press Shift-36-P. 


Press Tab to move forward or Shift-Tab to back. 








| B-2 Claris Home Page User's Guide 


Text shortcuts 


To do this 


Select the next or previous 
paragraph. 


Select text from the insertion 
point to the end or the beginning 
of the document. 


Use this shortcut on a PC with Windows 


Press Shift-Ctrl- | or Shift Ctrl-f. 


Not available. 


Use this shortcut on the Macintosh 


Press Shift-Option- | or Shift-Option-T. 


Press Shift-8-j or Shift-36-T. 





Select a range of characters. 


Press Shift-- or Shift- <-. 


Press Shift-- or Shift- <-. 





Select a range of whole words. 


Delete the previous or following 
word. 


Press Shift-Ctrl--— or Shift-Ctrl- <-. 


Press Ctrl-Backspace or Ctrl-Delete. 


Press Shift-Option--> or Shift-Option- ¢-. 


Press Option-Delete or Option-Forward Delete 
(del). 





Copy selected text. 


Ctrl-drag the text to the position where you 
want to place the copy. 


Option-drag the text to the position where you 
want to place the copy. 





Insert a non-breaking space. 


In Edit Page mode, press Alt and type 0160 on 
the numeric keypad. 


Press Option-space bar. 





Insert a line break. 


Press Shift-Enter. 


Press Shift-Return. 





Create a new list item. 


Press F8. 


Press #-Return. 





Create a new list item and indent 
it. 


Create a new list item and indent 
it to the previous level of 
indentation (decrease indent). 


Place the insertion point in the list and press F9. 


Place the insertion point in the list and press F7. 


Place the insertion point in the list and press 
Option-##-Return. 


Place the insertion point in the list and press 
Shift-#-Return. 





Reverse the direction of the 
search while using the Find/ 
Change, Find Next and Find 
Previous commands to go 
backward through a document 
or forward. 


In the Find/Change dialog box, hold down the 
Shift key while clicking Change, Find, Find Next, 
or Find Previous. 


In the Find/Change dialog box, hold down the 
Shift key while clicking Change, Find, Find Next, 
or Find Previous. 





Library shortcuts 


To do this 


Make a library entry using 
selected text. 


To perform various tasks on 
selected objects in the library 
window. 


Use this shortcut on a PC with Windows 


Drag the text to the left section of the library 
window. 


Right-click the selected object and choose 
various options from the context menu. 


Use this shortcut on the Macintosh 


Drag the text to the left section of the library 
window. 


Control-click the selected object and choose 
various options from the context menu. 








Images and image map shortcuts 


To do this 


Return a selected image to its 
original size (width and height). 


Return a selected image to its 
original width. 


Use this shortcut on a PC with Windows 


Double-click the lower-right corner handle of the 
image border. 


Double-click the right handle of the image 
border. 
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Use this shortcut on the Macintosh 


Double-click the lower-right corner handle of the 
image border. 


Double-click the right handle of the image 
border. 





Return a selected image to its 
original height. 


Double-click the bottom handle of the image 
border. 


Double-click the bottom handle of the image 
border. 





Resize a selected image 
proportionately. 


Hold down Shift and drag the lower-right corner 
handle. 


Hold down Shift and drag the lower-right corner 
handle. 





Replace a “missing image” icon 
with a new image. 


Right-click the icon, choose Browse Files from 
the context menu, and select the new image. 


Control-click the icon, choose Browse Files from 
the context menu, and select the new image. 





Open the Image Object Editor. 


Double-click the image or right-click the image 
and choose Image Object Editor from the context 
menu. 


Double-click the image or Control-click the 
image and choose Image Object Editor from the 
context menu. 





Open an image in the 
Transparency and Interlacing 
Image Editor. 


Open the Image Map Editor. 


Ctrl-double-click the image. 


Right-click the object and choose Image Map 
Editor from the context menu. 


Option-double-click the image. 


Control-click the object and choose Image Map 
Editor from the context menu. 





Move a selected hotspot | pixel 
in the Image Map Editor. 


Press the arrow keys. 


Press the arrow keys. 





Move a selected hotspot 10 
pixels in the Image Map Editor. 


Hold down Ctrl while pressing the arrow keys. 


Hold down Option while pressing the arrow 
keys. 





Resize a selected hotspot | pixel 
in the Image Map Editor. 


Hold down Shift while pressing the arrow keys. 


Hold down Shift while pressing the arrow keys. 





Resize a selected hotspot 10 
pixels in the Image Map Editor. 


Hold down Shift-Ctrl while pressing the arrow 
keys. 


Hold down Shift-Option while pressing the 
arrow keys. 
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Links shortcuts 


To do this 


Use this shortcut on the Macintosh 


Use this shortcut on a PC with Windows 


Open the Link Editor. 


Create a link. 


Press Crtl-L or Enter (numeric keypad) with 
Number Lock off. 


Select the text or image, right-click it, and 
choose Link to File from the context menu. 


You can also choose a file listed under Link to 
Recent URL or Link to open file in the context 
menu. 


Press 8-L or Enter (numeric keypad) with 
Number Lock off. 


Select the text or image, Control-click it, and 
choose Link to File from the context menu. 


You can also choose a file listed under Link to 
Recent URL or Link to open file in the context 
menu. 





Test a selected link in Edit Page 
mode. 


Right-click the link and choose Follow Link from 
the context menu. 


Control-click the link and choose Follow Link 
from the context menu. 





Remove a selected link. 


Right-click the link and choose Remove Link 
from the context menu. 


Control-click the link and choose Remove Link 
from the context menu. 





Insert an anchor in place of 
selected text. 


Insert a link to an anchor. 


Right-click the selected text and choose Insert 
Anchor from the context menu. 


Note Claris Home Page names the anchor for you. 


Ctrl-drag the anchor to the location on the page 
or on another page where you want to create the 
link. 


Control-click the selected text and choose 
Insert Anchor from the context menu. 


Note Claris Home Page names the anchor for you. 


Option-drag the anchor to the location on the 
page or on another page where you want to 
create the link. 





Appendix C: Troubleshooting and problem solving 





Problems installing or running Claris Home Page 


Every time I start Claris Home Page, it opens one or more files without 
my telling it to. 


Claris Home Page automatically opens any files in the Startup folder 
(Windows) or Startup Items folder (Macintosh) located in the same 
folder as the Claris Home Page application. To disable this, remove the 
unwanted files from the Startup or Startup Items folder. 


An error message appears when I try to start Claris Home Page: “There 
is not enough memory to open Claris Home Page (XXX needed, XXX 
available).” (Macintosh only) 


Your computer does not have enough memory to use Claris Home Page 
at the same time as the other applications you are running. If you have 
other applications running, try exiting from them (bring the other 
application to the front, and choose Quit from the File menu). See the 
documentation that came with your Macintosh computer for other ways 
to increase available memory. 


An error message appears when I try to start Claris Home Page: “You 
need a Macintosh equipped with a PowerPC processor to run this 
application.” (Macintosh only) 


You have installed a copy of Claris Home Page that is optimized for the 
PowerPC processor chip. This copy will not work on older Macintosh 
computers that are not equipped with this chip. You must re-install 
Claris Home Page from the original program disks. 


Problems using Claris Home Page 


Onscreen Help doesn't work. (Choosing an item from the Help menu 
displays an error message.) 


The Claris Home Page Help uses a set of help files that are installed 
along with the application. These files should be located in a folder 
named “Help files,” in the Claris Home Page folder. If the Help folder 
has been moved, renamed, or deleted, or if the application has been 
moved to a different location, then onscreen Help will not work. Make 
sure the Help folder is named “Help files” and that 
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it and the application are both located in the Claris Home Page folder, or 
re-install the help files using your original Claris Home Page installation 
disks. 


Images in JPEG format are drawn as gray rectangles in Claris Home 
Page, but appear fine in a browser. (On Windows, the same problem 
may sometimes occur for GIF images as well.) 


Claris Home Page requires certain software to be installed in order to 
display JPEG files, described as follows: 


On Windows, the Accusoft imaging DLL (Accuisr5.dll) must be 
installed in the same directory as Claris Home Page. To install the 
Accusoft imaging DLL, re-install Claris Home Page from the original 
program disks. 


On the Macintosh, the QuickTime application program version 2.0 or 
later must be installed in the Extensions folder. 


An image appears stretched or squashed. 


You may have accidentally resized the image, or changed the size of the 
image in a drawing program. Click once on the image in Claris Home 
Page to select it, and then reset it to its natural size by either double- 
clicking on the resize handle in the lower-right corner of the image, or 
opening the Image Object Editor and clicking the Original Size button. 


In the place of where one of my images should appear, Claris Home 
Page shows a red box and the words “Corrupt or missing image” 
appear. (The words “Corrupt or missing image” may not appear for 
small images.) 


This happens when Claris Home Page can't locate an image file. The file 
may have been accidentally moved, renamed, or deleted, or your HTML 
file may have been moved without bringing the image file along. To 
correct the problem, first locate the image file (or re-create it if it has 
been deleted). Then select the red box, Ctrl-double-click (Windows) or 
Command-double-click (Macintosh) it and choose Browse Files from 
the context menu. Claris Home Page displays a standard file selection 
dialog box. Select the image file and click OK. The red box should be 
replaced by the desired image. 
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In some cases, the red box and “Corrupt or missing image” label may 
also appear if the image file is corrupt, or if there is not enough memory 
for Claris Home Page to display the image. If you suspect this may be 
the case, verify that the image file is not corrupt (for example, by 
opening it in another application), and try closing other documents or 
giving Claris Home Page more memory. 


Problems opening files not created in Claris Home Page 


When I double-click on an HTML file on the desktop, Claris Home Page 
isn't opened, the browser is. (Windows only) 


On Windows, only one application is allowed to be the default viewer 
for a given file extension. In this case, the browser is the default viewer 
for HTML files, so it is opened when you click on an HTML file. To 
open an HTML file in Claris Home Page, drag the file itself (not a 
shortcut) to the Claris Home Page icon, or start Claris Home Page 
directly, and choose Open from the File menu. You can also change the 
association of the file type—see your Windows documentation for more 
details. 


When I open an HTML document that wasn’t created in Claris Home 
Page, it contains mysterious fragments of red text. 


If a file contains incorrect HTML code, Claris Home Page displays the 
incorrect codes in red. This often occurs with files created in a text 
editor—browser applications are relatively tolerant of HTML errors, so 
you might not be aware of the error until you open the file in Claris 
Home Page. To correct the problem, simply delete the red text. 


This problem can also occur for files that make use of HTML extensions 
not supported by Claris Home Page, such as blinking text. If you open a 
file that contains blinking text in Claris Home Page, the tags <BLINK> 
and </BLINK> appear on either side of the blinking text. If you delete 
the BLINK tags, the text will no longer blink when it appears in a 
browser. 


When Claris Home Page displays red HTML code in your document, 
this is due to the use of HTML extensions (which should not be deleted) 
or errors in the HTML file (which should be deleted). If you are unsure, 
try making a copy of the file, removing the questionable code, and 
viewing the resulting file in a browser application. If removing the 
questionable code does not change the document's appearance in a 
browser, then you can safely delete it. 
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When I open an HTML document that wasn’t created in Claris Home 
Page, some of the HTML does not display correctly (blinking text, Java 
applets, browser plug-ins, etc.). 


HTML is a rapidly evolving standard, and is constantly being extended. 
Claris Home Page does not support every HTML extension that has been 
proposed. If your document uses an extension to HTML that is not 
supported by Claris Home Page, it may not appear correctly in Claris 
Home Page. This is usually indicated by the appearance of the unknown 
HTML codes in red. This does not affect the appearance of the document 
in a browser; it only affects the appearance within Claris Home Page 
itself. To get a better feel for how the document will appear in a browser, 
use Preview in Browser mode. 


Problems with links 


When I click on a link, Claris Home Page displays the message “Sorry, 
Claris Home Page 3.0 can only follow links to local files.” 


All links in an HTML file contain a URL (Uniform Resource Locator), 
that identifies the file or other object that the link points to. There are two 
types of URLs: local URLs, which point to a file on the local machine 

(or to a file on the same machine as the document containing the link), 
and external URLs, which point to a file on a machine somewhere on the 
Internet. Claris Home Page can only process local URLs. To test a link 
to an external URL, open your document in a browser. 


Tip You can view the URL for a link by opening your document in Edit 
Page mode and double-clicking the link to open the Link Editor. The 
URL appears in the URL text box in the Link Editor. External links begin 
with a sequence of letters followed by a colon, such as http:, ftp:, or 
mailto:. Local links do not have this prefix. 


When I click on a link, Claris Home Page displays some other error 
message, such as “Sorry, unable to follow the URL “...”, due to a disk 
error: no such file (error -43).” 


This message appears when a link refers to a file that does not exist or 
that Claris Home Page can't find. The target file may have been 
accidentally moved or renamed, or may have been deleted. You should 
update the link's URL. This can be done as follows: 


1. Open the document containing the link. 


If necessary, switch to Edit Page mode by choosing Edit Page from the 
View menu (Windows) or Window menu (Macintosh). 
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2. Select the link. 


3. Choose Link to File from the Insert menu, or click the Browse Files 
button in the Link Editor. 


4. Select the target file for the link. 


Note A common cause for this error is incorrect use of the “Use absolute 
pathnames” setting in the HTML Source tab of the Applications Options 
dialog box (Windows) or Preferences dialog box (Macintosh). This 
setting should normally not be enabled. 


When I click on a link that points to an anchor in the same file, nothing 
happens. Or, when I click on a link that points to an anchor in another 
file, Claris Home Page takes me to the beginning of the other file, 
instead of taking me to the location of the anchor. 


The anchor has been accidentally renamed or deleted, or the link's URL 
has been entered incorrectly. To correct this problem: 


1. Verify that the target anchor still exists (open the target document in 
Edit Page mode, and look for the anchor symbol). 


If the anchor does not exist, choose Anchor from the Insert menu to re- 
create it. 


2. Select the target anchor, and choose Object Editor from the View menu 
(Windows) or Show Object Editor from the Window menu 
(Macintosh). 


The Name text box in the Object Editor shows you the name of the 
anchor. If the name is incorrect, type the correct name in this box or 
select the name from the pop-up menu. 


3. Open the document containing the link in Edit Page mode. 
4. Select the link and open the Link Editor. 


5. If the anchor is local to this document, inspect the value in the URL 
text box. (It should begin with a pound sign followed by the name of 
the anchor.) Enter the correct anchor name in this box. 


If the anchor is located on another Web page or site, the value in the 
URL text box should include the filename of the page or URL of the 
site followed by the pound sign (#) and the correct anchor name. 
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Problems viewing documents in a browser 


When I choose the Preview in Browser command, the following message 
appears: “Sorry, not enough memory to open the browser application. 
Try quitting some other applications.” 


There is not enough memory to open the browser application at the same 
time as Claris Home Page. 


On a PC with Windows, some browsers will restart each time a page is 
previewed and anew copy of the application is opened. To free memory, 
close the application windows not in use. 


On the Macintosh, try reducing the amount of memory allocated to the 
browser (by selecting the browser's icon in the Finder operating system 
software and choosing Get Info from the File menu), or follow the usual 
steps for making more memory available: quitting other applications, 
turning off extensions, etc. Typically, you will need a Macintosh 
equipped with at least 12 megabytes of memory to run Claris Home 
Page and a browser application at the same time. 


When I choose the Preview in Browser command, the browser opens, 
but the file is not displayed. 


The browser may not be installed correctly. Some browsers (notably, 
Internet Explorer for Windows) can be damaged by applications that 
change registry entries, causing the system to incorrectly send “open 
file” messages to them. Re-install a fresh copy of the browser if you have 
this problem. 


When I choose the Preview in Browser command, some other error 
message appears, such as “Sorry, an error occurred (-xx) while 
attempting to open the browser application”, or “Sorry, an error 
occurred while attempting to send this file to the browser.” 


There may be a problem with the browser application you have selected 
as the default, or the browser application may be missing. 


Choose Application Options from the Tools menu (Windows) or 
Preferences from the Edit menu (Macintosh) to open the Preferences 
dialog box. Click the Browser Preview tab to display a new set of options. 
Click Clear and re-select the browser. 


My page doesn't look quite the same in the browser as it does in Claris 
Home Page (different fonts, lines are broken at different positions, etc.). 
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The HTML standard does not precisely define the appearance of a 
document. It sets broad guidelines, but individual programs (such as 
browsers) are free to use their own variations. Therefore, it is impossible 
to create an HTML file that will look exactly the same in every browser. 


Claris Home Page 3.0 attempts to display HTML documents as they will 
appear in Netscape Navigator 2.0 (based on Navigator's default 
preferences settings). Certain features (such as table layout) are 
implemented differently in Claris Home Page than in Navigator, and 
minor differences in spacing are inevitable. With other browsers, or if 
you have altered Navigator's font preferences, there will be greater 
differences. Finally, your document may use advanced features not 
supported by other browsers, such as tables, frames, or colored text. 


If you plan to publish your HTML document on the Internet, it may be 
viewed by many different browsers on many different platforms. 
Therefore, you should not attempt to, or expect to, precisely control the 
layout and appearance of your document. Even if your HTML document 
is to be used locally (on an “Intranet’’), users may employ different 
browsers or have customized font preferences and other browser settings 
that will affect the appearance of the document. 


When I view my page in a browser, a strange character sometimes 
appears on blank lines. 


Claris Home Page inserts a non-breaking space character (represented 
by the ISO Latin Character code, &nbsp;) on what are otherwise blank 
lines. This is done to work around the interpretation of HTML by certain 
browsers, such as Netscape Navigator, which ignores blank lines. 
Unfortunately, other browsers sometimes incorrectly interpret this 
HTML as representing a different (non-blank) character: for example, 
Netscape Navigator 2.0 with “Japanese encoding autodetect” enabled 
sometimes does this. 
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Links within my Web site work fine in Preview Page mode, but don't 
work when I click on them in a browser. 


A variety of problems can cause links to function incorrectly (see 
“Problems with links” on page C-4). One additional problem that can 
occur outside of Claris Home Page involves the Base Document URL text 
box in the Document Options dialog box. Claris Home Page 3.0 assumes 
that this field (which corresponds to the <BASE> tag in the HTML 
source), if not empty, contains the URL of the document in which it 
appears. If you enter a different URL in this text box, relative links may 
not work correctly. The solution is to remove the value in the Base 
Document URL text box, or set it to the URL of the page in question, and 
then use the Link Editor to re-create any malfunctioning links in that 


page. 


Images from the Claris Home Page libraries work fine when I view my 
pages on my local computer, but don't work when I upload my site to a 
Web (HTTP) server. 


When uploading your site to a Web server, you need to make sure to 
include all files used in the site, including image files. The standard way 
to do this is to create an Images folder inside the folder that contains your 
site, and to place all image files in this folder. When you transfer 
(upload) the site folder to a server, the images will automatically be 
included. 


When you insert an image from a library into your document, Claris 
Home Page uses the path to the original image file in the Content folder. 
To correct the problem, you need to copy the actual image file into your 
site's Images folder, and replace all references in your site to the original 
image file with references to the new file or open the Site Editor and use 
the consolidate feature. 


Problems using Claris Home Page assistants 


What happens if I finish the assistant early? 


The assistant assigns default values to all of the settings and creates a site 
based on the default settings. 


I used a Claris Home Page assistant to create a site and know I 
wondering, where is my home page? 


Your home page is named index.htm and it is located inside the folder 
you selected to save your assistant files. 
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I finished the assistant-now what do I do if my links are not working? 


Make sure your links reference the correct filenames. If you changed the 
filenames of the documents created by this assistant, you must re-create 
the links using the Link Editor and reference the new filenames. 


How do I upload my new site to the Web? 


When you finish the assistant, Claris Home Page opens the new site in 
the Site Editor. To upload the site to a Web server, click the Upload 
button — on the Site Editor toolbar. To use the Uploading feature, make 
sure your computer network supports File Transfer Protocol (FTP) and 
that your Web server account settings are specified completely. For 
more information on setting FTP options and uploading your pages, see 
chapter 12, “Uploading your pages to a Web server.” 


What do I do if my images are missing after I upload my site to the Web? 


The first thing you should do is consolidate all the images in your site by 
clicking the Consolidate button —_ on the Site Editor toolbar. When you 
consolidate the images, Claris Home Page copies the image files or other 
referenced content files from other folders and places them in your site 
folder. Any references to this content in your Web pages will be updated 
automatically to ensure that none of your media is missing when you 
upload your site again to the Web server. 
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tables 5-5 
text 2-19 


F 


File Transfer Protocol (FTP) 
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viewing details of 10-21 
FileMaker Form Library, 
described 10-25 
FileMaker Reference Library, 
described 10-26 
requirements for using 10-2 
using CDML tags from 10-24 
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FileMaker Pro forms; FileMaker 
Connection Assistant; FileMaker 
Connection Libraries 
files 
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pages 
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naming 2-24 
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saving 2-24 
site definition 1-8, 12-1 
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uploading 12-1 
viewing 2-12 
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frames 8-8 
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links 7-14 
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pop-up menus 9-11 
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submit buttons 9-16 
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testing 9-20 
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documents C-3 


Frame Assistant 2-5, 8-3 
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frame layout documents. See frames 
Frame Object Editor 8-6 
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browser support of 8-1 
creating 8-2, 8-4, 8-5 
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formatting 
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framesets 8-5, 8-10 
Stars size option 8-9 
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frameset. See frames 
FTP site URL syntax 7-7 
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GIF files. See images; libraries 
glossary lists. See lists 
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greater than sign, special code for A-1 
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Header cells in tables 5-10 
headings 3-5 

hidden entries, in forms 9-18 
horizontal rules 3-17 
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HTML 
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described 1-1 
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A-1 
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HTML code for special 
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HTML source. See Edit HTML Source 
mode 


HTTP URL syntax 7-7 
hypertext links. See links 


Hypertext Markup Language. See 
HTML 


hyphenating limitations 3-1 


image files 
See also files; images; Web pages; 
libraries 
BMP 4-1, 4-2 
consolidating 12-4 
converting 4-1, 4-2, 4-3 
downloading 4-1, 4-8 
GIF 4-1, 4-2, 4-3, 4-8 
JPEG 4-1, 4-2 
PICT 4-1, 4-2 
sizes 2-15 
storing 1-8 
supported formats 4-1 
Image Map Editor 7-11 
image maps 
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behavior attributes 7-11 
Circular Link tool 7-9, 7-11 
client-side 7-9 
creating 4-10, 7-11 
default links 7-10, 7-11 
described 7-8 
hotspots 7-8 
Rectangular Link tool 7-9, 7-11 
server-side 7-10 
Image Object Editor 4-5, 7-11 
images 
See also image files; image maps 
adding 4-2 
alternative label for 4-6 
behavior attributes 7-11 
borders 7-2 
buttons on forms 9-18 
deleting linked images 7-14 
described 4-1 
formatting 
aligning with text 4-6 
background colors 4-9 
borders 4-6 
changing attributes 4-5 to ??, 
4-7 
scaling 4-7 


sizing 4-7 
transparent 4-9 
hotspots, image map links 4-10 
in tables 5-2 
interactive 4-10 
interlaced 4-8 
JPEG images, gray rectangle 
display C-1 
linking 7-8 
performing actions 4-10 
Web page backgrounds 2-22 
indented lists. See lists 
indenting text 3-5, 3-11 
installation, troubleshooting C-1 
interlaced images 4-8 


ISO Latin-1 character set 3-8 
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Java applets 
adding 11-9 
adding extra HTML 11-12 
changing name or location 11-13 
display 11-11 
specifying parameters 11-11 
Java applets, adding 11-9 
JPEG files. See images; libraries 


jumps. See links; frames, assigning 
Web pages to 
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keyboard shortcuts 


listed B-1 
L 
labeling 
images 4-6 


list items 3-5 
table rows and columns 5-5 
left aligning text 3-5 
less than sign, special code for A-1 
letter spacing 3-5 
libraries 
See also elements; image files; 
files; Web pages 
changing text elements 6-6 
copying elements from 6-3 
creating 6-4 


described 6-1 
displaying 6-3 
editing text elements in 6-7 
entries 
adding 6-6 
deleting 6-7 
editing 6-6 
moving 6-6 
renaming 6-7 
reordering 6-6 
selecting 6-1 
file extensions 6-3 


opening 6-3 
line break format 2-20 
lines 
breaks 3-1, 3-2 
horizontal 3-17 
spacing 3-1 
Link Editor 2-11, 7-2 
links 


See also anchors; image maps 
active color 7-15 
borders 7-2 

breaking 7-14 
changing colors 7-14 
copying 7-2, 7-13 
creating 7-2, 7-4, 7-6 
deleting 7-14 
described 7-1 

error messages C-4 
external Web pages 7-6 
hotspots 7-8 

in frames 8-11, 8-14 
normal color 7-15 
pathnames 2-20 
planning 7-1 
repeating 7-2 

testing 7-12 

to email address 7-7 
to FTP site 7-7 
visited color 7-15 
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lists 

See also forms 

bullet 3-9 

described 3-9 

glossary 3-9 
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indented 3-11 

items 
adding 3-10 
number styles 3-11 
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reordering 3-11 
selecting 3-12 
nested 3-11 
numbered 3-9, 3-10 
ordered 3-9 
scrolling, in forms 9-11 
unordered 3-9 


logical character styles 3-5, 3-7 
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mailto URLs 7-7 
media folder 12-5 
modes 
See also Site Editor 
Edit Frames 8-2 
Edit HTML Source 2-16 
Edit Page 2-6 
Preview in Browser 2-12, 2-13, 
2-14, 2-24 
Preview Page 2-13 
monospace font 3-5 
movie play options, setting 11-7 
multimedia plug-in options 11-3 


navigational frame layout 8-11 
nesting 

See also frames; lists 

frames 8-1 

lists 3-11 
Netscape Navigator 2-13 
Newsletter Assistant. See assistants 
normal links, default color 7-15 
number style 3-5 
numbered lists. See lists 


Oo 


object editors 
See also toolbars 
Anchor Object Editor 7-6 
Applet Object Editor 11-10 
described 2-10 
for form areas 9-2 
for form elements 9-4 
Frame List Object Editor 8-6, 8-7, 
8-10 
Frame Object Editor 8-6 


Horizontal Rule Object 
Editor 3-17 

Image Map Editor 7-11 
Image Object Editor 4-5, 7-11 
Link Editor 2-11, 7-2 
QuickTime Object Editor 11-6 
Table Object Editor 5-3 

of 8-10 

opening 
HTML files 2-6 
images 4-2, 11-2, 11-6 
libraries 6-1 

order forms 9-1 

ordered lists. See lists 


Pp 


page templates. See templates 
paragraph alignment uses 2-20 
paragraphs 

See also characters 

aligning 3-5 

creating 3-1 

formatting 3-4 

spacing 3-1 

styles 3-4 


parent frameset 
described 8-5 
selecting 8-10 


Password Field Object Editor 9-14 


passwords 
for FileMaker Pro databases 10-5 
form element for 9-14 
saving FTP account 
passwords 12-9 


pasting elements 2-7 
pathnames 2-20 
Personal Site Assistant. See assistants 
physical character styles 3-5, 3-6 
PICT files. See images; libraries 
pictures. See images; libraries 
planning Web sites 1-1, 1-3 
plug-ins, browser 1-12, 11-1 
plus sign, special code for A-1 
pop-up menu 

See also forms 

defining values for 9-11 


Pop-up Object Editor 9-11 
preferences. See application options 


preformatted text 3-5 
Presentation Assistant. See assistants 
previewing 
See also testing 
background images 2-21 
baseline text alignment 5-11 
frame documents 8-2 
in a browser 1-10, 2-13 
in Preview Page mode 2-13 
number styles 3-10 
special characters 3-9 
printing 
Web pages 2-27 
problem solving tips 
accessing onscreen help C-1 
fixing links C-4 
installing Claris Home Page C-1 
opening files C-3 
previewing in browser C-6 
running Claris Home Page C-1 
using assistants C-6 
using Claris Home Page 
Assistants C-8 
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questionnaires. See forms 
QuickTime 

adding movies 11-5 

movie play options 11-7 

resizing movie window 11-7 
QuickTime Object Editor 11-6 


quotations, formatting 3-5 
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Radio Button Object Editor 

radio buttons. See forms; toolbars 
Rectangular Link tool 7-9, 7-11 
relative pathnames 2-20 

remote server. See Web servers 
replacing text 3-2 

Report Assistant. See assistants 
resizing elements 2-11 

right aligning text 3-5 

right click. See context menu 


root frameset 
described 8-1 
selecting 8-10 
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rows. See lists; preformatted text; 
tables 


rules, horizontal 3-17 


S 


saving elements 6-4 

saving files 2-24 

saving files to a remote server 12-12 
School Site Assistant. See assistants 
scrolling lists. See forms 

search and replace (text) 3-2 


searching in a database form. See 
FileMaker Pro forms 


selecting 
framesets 8-10 
library entries 6-3 
list items 3-12 
table cells 5-2 


separators 3-17 

server. See Web server 

shortcut menu. See context menu 
site assistants 2-4 


site definition files 
described 12-1 


Site Editor 
See also downloading; modes; 
uploading 
defining a site 1-8 
described 1-7 
site definition file 1-9, 12-2 
using 2-27 
site,setting up 1-7 
span cells across columns/rows 5-9 
special characters 3-8, A-1 
spelling checker 3-12 
spreadsheet data 5-1 
Standard Site Assistant. See assistants 
starting Claris Home Page 2-1 
startup options 2-3 
statistics, download 2-14 
Style toolbar 2-7 


styles 
character 3-5, 3-7, 3-14 
colors 3-14 
HTML limitations 3-1 
logical 3-5 
paragraph 3-4 


physical 3-5 
special characters 3-8 
Submit Button Object Editor 9-16 


symbols, typing 3-8 
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table cells 
described 5-1 
padding 5-4 
selecting 5-2 

Table Object Editor 5-3 


tables 
See also lists; preformatted text 
adding extra HTML attributes 5-4 
browser support 5-1 
columns 5-4 
customizing 3-18 
described 5-1 
formatting 
aligning elements 5-10 
borders 5-4 
changing attributes 5-4 
changing cell attributes 5-5 
height 5-6 
spacing 5-4 
text 5-10 
width 5-6 
headings 5-10 
importing 
spreadsheet data 5-1 
tab separated files 5-1 
inserting 5-1 
labeling 5-5 
libraries 6-1 
rows 5-4 
selecting 5-2 
tags. See HTML; styles 


templates 
See also assistants; Web pages 
described 1-3 
saving 2-25 

testing 
See also previewing 
appearance of text 3-1 
FileMaker Pro forms 10-56 
form input elements 9-20 
form reset buttons 9-15 
form submit buttons 9-16 
frame associations 2-13 
links 7-12 
QuickTime movies 11-8 


Web pages 2-13 
with different browsers 1-11 
text 
adding 3-2 
addresses 3-5 
bylines 3-5 
copying 3-1 
deleting 3-1 
finding 3-2 
formatting 
aligning 3-4, 4-6 
colors 3-7, 3-14 
fonts 3-1 
headings 3-4 
HTML limitations 3-1 
line breaks 3-1 
monospace font 3-5 
preformatted 3-5 
quotations 3-4 
sizing 3-7 
spacing characters 3-5 
styles 3-4 
hyphenating 3-1 
in forms 9-6, 9-7 
in lists 3-9 
in tables 5-10 
libraries 6-6 
paragraphs 3-4 
replacing 3-2 
special characters 3-8 
styles 3-5 
titles 2-25 
wrapping 3-1 
Text Area Object Editor 9-7 
text areas. See forms 
Text Field Object Editor 9-6 
text fields. See forms 
time estimates 2-14 
titles 2-25 
tool palette for form elements 2-9 
toolbars 
See also object editors 
described 2-7 


transparent images 4-9 


troubleshooting. See problem solving 
tips 


U 


undoing actions 2-7 
Uniform Resource Locator. See URLs 
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unordered lists. See lists 
uploading 
See also copying; downloading; 
Site Editor 
described 12-1 
entire Web sites 12-10 
open Web pages toa server 12-12 
preparing for 12-1 
URLs 
See also addresses; anchors; links 
copying 7-2 
email addresses 7-7 
examples 7-7 
FTP sites 7-7 
HTTP 7-7 
mailto 7-7 
specifying 7-6 
syntax 7-7 
Web pages 7-7 
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visited links, default color 7-15 


W,X, Y,Z 


wallpaper. See backgrounds 
Web browsers 1-11, 1-12, 2-14 
HTML feature support 1-3 
plug-in applications 11-1 
previewing in 1-10 
testing with 1-11 
Web Companion 10-1, 10-5, 10-56 
Web pages 
See also files; image files; 
FileMaker forms; templates 
assigning to frames 8-8 
backgrounds 2-21 
creating titles 2-25 
editing 2-6 
linking 7-1 
navigational frame layout 8-1 
opening 2-6 
previewing 2-12, 2-13 
printing 2-27 
saving as templates 2-24 
URL syntax 7-7 
using frames 8-1, 8-2, 8-11 
viewing 2-12 
Web Security database 10-5 
Web servers 


account settings 12-8 
downloading files from 12-14 
testing on 1-12 
uploading files to 12-9 
Web Sharing 10-1, 10-4, 10-5, 10-56 
Web sites 
See also copying; uploading; 
downloading; Site Editor 
definition file 12-1 
deleting files from 12-15 
design of 1-2 
media folder 12-5 
size of 12-2 
testing 1-1 
words, counting 2-15 


